/** Swiper 4.5.1 Most modern mobile touch slider and framework with hardware accelerated transitions http://www.idangero.us/swiper/ Copyright 2014-2019 Vladimir Kharlampidi Released under the MIT License Released on: September 13, 2019 */ .swiper-container, .pg-node-id-1, .pg-main-cs-4 { margin-left: auto; margin-right: auto; position: relative; overflow: hidden; list-style: none; padding: 0; z-index: 1; } .swiper-container-no-flexbox .swiper-slide, .pg-node-id-2, .pg-main-cs-4 { float: left; } .swiper-container-vertical > .swiper-wrapper, .pg-node-id-3, .pg-main-cs-4 { -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; } .swiper-wrapper, .pg-node-id-4, .pg-main-cs-4 { position: relative; width: 100%; height: 100%; z-index: 1; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-transition-property: -webkit-transform; transition-property: -webkit-transform; -o-transition-property: transform; transition-property: transform; transition-property: transform, -webkit-transform; transition-property: transform,-webkit-transform; -webkit-box-sizing: content-box; box-sizing: content-box; } .swiper-container-android .swiper-slide, .swiper-wrapper, .pg-node-id-5, .pg-main-cs-4 { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } .swiper-container-multirow > .swiper-wrapper, .pg-node-id-6, .pg-main-cs-4 { -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; } .swiper-container-free-mode > .swiper-wrapper, .pg-node-id-7, .pg-main-cs-4 { -webkit-transition-timing-function: ease-out; -o-transition-timing-function: ease-out; transition-timing-function: ease-out; margin: 0 auto; } .swiper-slide, .pg-node-id-8, .pg-main-cs-4 { -webkit-flex-shrink: 0; -ms-flex-negative: 0; flex-shrink: 0; width: 100%; height: 100%; position: relative; -webkit-transition-property: -webkit-transform; transition-property: -webkit-transform; -o-transition-property: transform; transition-property: transform; transition-property: transform, -webkit-transform; transition-property: transform,-webkit-transform; } .swiper-slide-invisible-blank, .pg-node-id-9, .pg-main-cs-4 { visibility: hidden; } .swiper-container-autoheight, .swiper-container-autoheight .swiper-slide, .pg-node-id-10, .pg-main-cs-4 { height: auto; } .swiper-container-autoheight .swiper-wrapper, .pg-node-id-11, .pg-main-cs-4 { -webkit-box-align: start; -webkit-align-items: flex-start; -ms-flex-align: start; align-items: flex-start; -webkit-transition-property: height,-webkit-transform; transition-property: height,-webkit-transform; -o-transition-property: transform,height; transition-property: transform,height; transition-property: transform,height,-webkit-transform; } .swiper-container-3d, .pg-node-id-12, .pg-main-cs-4 { -webkit-perspective: 1200px; perspective: 1200px; } .swiper-container-3d .swiper-cube-shadow, .swiper-container-3d .swiper-slide, .swiper-container-3d .swiper-slide-shadow-bottom, .swiper-container-3d .swiper-slide-shadow-left, .swiper-container-3d .swiper-slide-shadow-right, .swiper-container-3d .swiper-slide-shadow-top, .swiper-container-3d .swiper-wrapper, .pg-node-id-13, .pg-main-cs-4 { -webkit-transform-style: preserve-3d; transform-style: preserve-3d; } .swiper-container-3d .swiper-slide-shadow-bottom, .swiper-container-3d .swiper-slide-shadow-left, .swiper-container-3d .swiper-slide-shadow-right, .swiper-container-3d .swiper-slide-shadow-top, .pg-node-id-14, .pg-main-cs-4 { position: absolute; left: 0; top: 0; width: 100%; height: 100%; pointer-events: none; z-index: 10; } .swiper-container-3d .swiper-slide-shadow-left, .pg-node-id-15, .pg-main-cs-4 { background-image: -webkit-gradient(linear, right top, left top, from(rgba(0, 0, 0, 0.5)), to(rgba(0, 0, 0, 0))); background-image: -webkit-linear-gradient(right, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0)); background-image: -o-linear-gradient(right, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0)); background-image: linear-gradient(to left, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0)); } .swiper-container-3d .swiper-slide-shadow-right, .pg-node-id-16, .pg-main-cs-4 { background-image: -webkit-gradient(linear, left top, right top, from(rgba(0, 0, 0, 0.5)), to(rgba(0, 0, 0, 0))); background-image: -webkit-linear-gradient(left, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0)); background-image: -o-linear-gradient(left, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0)); background-image: linear-gradient(to right, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0)); } .swiper-container-3d .swiper-slide-shadow-top, .pg-node-id-17, .pg-main-cs-4 { background-image: -webkit-gradient(linear, left bottom, left top, from(rgba(0, 0, 0, 0.5)), to(rgba(0, 0, 0, 0))); background-image: -webkit-linear-gradient(bottom, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0)); background-image: -o-linear-gradient(bottom, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0)); background-image: linear-gradient(to top, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0)); } .swiper-container-3d .swiper-slide-shadow-bottom, .pg-node-id-18, .pg-main-cs-4 { background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0.5)), to(rgba(0, 0, 0, 0))); background-image: -webkit-linear-gradient(top, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0)); background-image: -o-linear-gradient(top, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0)); background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0)); } .swiper-container-wp8-horizontal, .swiper-container-wp8-horizontal > .swiper-wrapper, .pg-node-id-19, .pg-main-cs-4 { -ms-touch-action: pan-y; touch-action: pan-y; } .swiper-container-wp8-vertical, .swiper-container-wp8-vertical > .swiper-wrapper, .pg-node-id-20, .pg-main-cs-4 { -ms-touch-action: pan-x; touch-action: pan-x; } .swiper-button-next, .swiper-button-prev, .pg-node-id-21, .pg-main-cs-4 { position: absolute; top: 50%; width: 27px; height: 44px; margin-top: -22px; z-index: 10; cursor: pointer; background-size: 27px 44px; background-position: center; background-repeat: no-repeat; } .swiper-button-next.swiper-button-disabled, .swiper-button-prev.swiper-button-disabled, .pg-node-id-22, .pg-main-cs-4 { opacity: .35; cursor: auto; pointer-events: none; } .swiper-button-prev, .swiper-container-rtl .swiper-button-next, .pg-node-id-23, .pg-main-cs-4 { background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23007aff'%2F%3E%3C%2Fsvg%3E"); left: 10px; right: auto; } .swiper-button-next, .swiper-container-rtl .swiper-button-prev, .pg-node-id-24, .pg-main-cs-4 { background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23007aff'%2F%3E%3C%2Fsvg%3E"); right: 10px; left: auto; } .swiper-button-prev.swiper-button-white, .swiper-container-rtl .swiper-button-next.swiper-button-white, .pg-node-id-25, .pg-main-cs-4 { background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23ffffff'%2F%3E%3C%2Fsvg%3E"); } .swiper-button-next.swiper-button-white, .swiper-container-rtl .swiper-button-prev.swiper-button-white, .pg-node-id-26, .pg-main-cs-4 { background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23ffffff'%2F%3E%3C%2Fsvg%3E"); } .swiper-button-prev.swiper-button-black, .swiper-container-rtl .swiper-button-next.swiper-button-black, .pg-node-id-27, .pg-main-cs-4 { background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23000000'%2F%3E%3C%2Fsvg%3E"); } .swiper-button-next.swiper-button-black, .swiper-container-rtl .swiper-button-prev.swiper-button-black, .pg-node-id-28, .pg-main-cs-4 { background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23000000'%2F%3E%3C%2Fsvg%3E"); } .swiper-button-lock, .pg-node-id-29, .pg-main-cs-4 { display: none; } .swiper-pagination, .pg-node-id-30, .pg-main-cs-4 { position: absolute; text-align: center; -webkit-transition: .3s opacity; -o-transition: .3s opacity; transition: .3s opacity; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); z-index: 10; } .swiper-pagination.swiper-pagination-hidden, .pg-node-id-31, .pg-main-cs-4 { opacity: 0; } .swiper-container-horizontal > .swiper-pagination-bullets, .swiper-pagination-custom, .swiper-pagination-fraction, .pg-node-id-32, .pg-main-cs-4 { bottom: 10px; left: 0; width: 100%; } .swiper-pagination-bullets-dynamic, .pg-node-id-33, .pg-main-cs-4 { overflow: hidden; font-size: 0; } .swiper-pagination-bullets-dynamic .swiper-pagination-bullet, .pg-node-id-34, .pg-main-cs-4 { -webkit-transform: scale(0.33); -ms-transform: scale(0.33); transform: scale(0.33); position: relative; } .swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active, .pg-node-id-35, .pg-main-cs-4 { -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); } .swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-main, .pg-node-id-36, .pg-main-cs-4 { -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); } .swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev, .pg-node-id-37, .pg-main-cs-4 { -webkit-transform: scale(0.66); -ms-transform: scale(0.66); transform: scale(0.66); } .swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev-prev, .pg-node-id-38, .pg-main-cs-4 { -webkit-transform: scale(0.33); -ms-transform: scale(0.33); transform: scale(0.33); } .swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next, .pg-node-id-39, .pg-main-cs-4 { -webkit-transform: scale(0.66); -ms-transform: scale(0.66); transform: scale(0.66); } .swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next-next, .pg-node-id-40, .pg-main-cs-4 { -webkit-transform: scale(0.33); -ms-transform: scale(0.33); transform: scale(0.33); } .swiper-pagination-bullet, .pg-node-id-41, .pg-main-cs-4 { width: 8px; height: 8px; display: inline-block; border-radius: 100%; background: #000; opacity: .2; } button.swiper-pagination-bullet, .pg-node-id-42, .pg-main-cs-4 { border: none; margin: 0; padding: 0; -webkit-box-shadow: none; box-shadow: none; -webkit-appearance: none; -moz-appearance: none; appearance: none; } .swiper-pagination-clickable .swiper-pagination-bullet, .pg-node-id-43, .pg-main-cs-4 { cursor: pointer; } .swiper-pagination-bullet-active, .pg-node-id-44, .pg-main-cs-4 { opacity: 1; background: #007aff; } .swiper-container-vertical > .swiper-pagination-bullets, .pg-node-id-45, .pg-main-cs-4 { right: 10px; top: 50%; -webkit-transform: translate3d(0, -50%, 0); transform: translate3d(0, -50%, 0); } .swiper-container-vertical > .swiper-pagination-bullets .swiper-pagination-bullet, .pg-node-id-46, .pg-main-cs-4 { margin: 6px 0; display: block; } .swiper-container-vertical > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic, .pg-node-id-47, .pg-main-cs-4 { top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); width: 8px; } .swiper-container-vertical > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet, .pg-node-id-48, .pg-main-cs-4 { display: inline-block; -webkit-transition: .2s top,.2s -webkit-transform; -o-transition: .2s top,.2s -webkit-transform; transition: .2s top,.2s -webkit-transform; -o-transition: .2s transform,.2s top; -webkit-transition: .2s transform,.2s top; transition: .2s transform,.2s top; -webkit-transition: .2s transform,.2s top,.2s -webkit-transform; -o-transition: .2s transform,.2s top,.2s -webkit-transform; transition: .2s transform,.2s top,.2s -webkit-transform; } .swiper-container-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet, .pg-node-id-49, .pg-main-cs-4 { margin: 0 4px; } .swiper-container-horizontal > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic, .pg-node-id-50, .pg-main-cs-4 { left: 50%; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); white-space: nowrap; } .swiper-container-horizontal > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet, .pg-node-id-51, .pg-main-cs-4 { -webkit-transition: .2s left,.2s -webkit-transform; -o-transition: .2s left,.2s -webkit-transform; transition: .2s left,.2s -webkit-transform; -o-transition: .2s transform,.2s left; -webkit-transition: .2s transform,.2s left; transition: .2s transform,.2s left; -webkit-transition: .2s transform,.2s left,.2s -webkit-transform; -o-transition: .2s transform,.2s left,.2s -webkit-transform; transition: .2s transform,.2s left,.2s -webkit-transform; } .swiper-container-horizontal.swiper-container-rtl > .swiper-pagination-bullets-dynamic .swiper-pagination-bullet, .pg-node-id-52, .pg-main-cs-4 { -webkit-transition: .2s right,.2s -webkit-transform; -o-transition: .2s right,.2s -webkit-transform; transition: .2s right,.2s -webkit-transform; -o-transition: .2s transform,.2s right; -webkit-transition: .2s transform,.2s right; transition: .2s transform,.2s right; -webkit-transition: .2s transform,.2s right,.2s -webkit-transform; -o-transition: .2s transform,.2s right,.2s -webkit-transform; transition: .2s transform,.2s right,.2s -webkit-transform; } .swiper-pagination-progressbar, .pg-node-id-53, .pg-main-cs-4 { background: rgba(0, 0, 0, 0.25); position: absolute; } .swiper-pagination-progressbar .swiper-pagination-progressbar-fill, .pg-node-id-54, .pg-main-cs-4 { background: #007aff; position: absolute; left: 0; top: 0; width: 100%; height: 100%; -webkit-transform: scale(0); -ms-transform: scale(0); transform: scale(0); -webkit-transform-origin: left top; -ms-transform-origin: left top; transform-origin: left top; } .swiper-container-rtl .swiper-pagination-progressbar .swiper-pagination-progressbar-fill, .pg-node-id-55, .pg-main-cs-4 { -webkit-transform-origin: right top; -ms-transform-origin: right top; transform-origin: right top; } .swiper-container-horizontal > .swiper-pagination-progressbar, .swiper-container-vertical > .swiper-pagination-progressbar.swiper-pagination-progressbar-opposite, .pg-node-id-56, .pg-main-cs-4 { width: 100%; height: 4px; left: 0; top: 0; } .swiper-container-horizontal > .swiper-pagination-progressbar.swiper-pagination-progressbar-opposite, .swiper-container-vertical > .swiper-pagination-progressbar, .pg-node-id-57, .pg-main-cs-4 { width: 4px; height: 100%; left: 0; top: 0; } .swiper-pagination-white .swiper-pagination-bullet-active, .pg-node-id-58, .pg-main-cs-4 { background: #fff; } .swiper-pagination-progressbar.swiper-pagination-white, .pg-node-id-59, .pg-main-cs-4 { background: rgba(255, 255, 255, 0.25); } .swiper-pagination-progressbar.swiper-pagination-white .swiper-pagination-progressbar-fill, .pg-node-id-60, .pg-main-cs-4 { background: #fff; } .swiper-pagination-black .swiper-pagination-bullet-active, .pg-node-id-61, .pg-main-cs-4 { background: #000; } .swiper-pagination-progressbar.swiper-pagination-black, .pg-node-id-62, .pg-main-cs-4 { background: rgba(0, 0, 0, 0.25); } .swiper-pagination-progressbar.swiper-pagination-black .swiper-pagination-progressbar-fill, .pg-node-id-63, .pg-main-cs-4 { background: #000; } .swiper-pagination-lock, .pg-node-id-64, .pg-main-cs-4 { display: none; } .swiper-scrollbar, .pg-node-id-65, .pg-main-cs-4 { border-radius: 10px; position: relative; -ms-touch-action: none; background: rgba(0, 0, 0, 0.1); } .swiper-container-horizontal > .swiper-scrollbar, .pg-node-id-66, .pg-main-cs-4 { position: absolute; left: 1%; bottom: 3px; z-index: 50; height: 5px; width: 98%; } .swiper-container-vertical > .swiper-scrollbar, .pg-node-id-67, .pg-main-cs-4 { position: absolute; right: 3px; top: 1%; z-index: 50; width: 5px; height: 98%; } .swiper-scrollbar-drag, .pg-node-id-68, .pg-main-cs-4 { height: 100%; width: 100%; position: relative; background: rgba(0, 0, 0, 0.5); border-radius: 10px; left: 0; top: 0; } .swiper-scrollbar-cursor-drag, .pg-node-id-69, .pg-main-cs-4 { cursor: move; } .swiper-scrollbar-lock, .pg-node-id-70, .pg-main-cs-4 { display: none; } .swiper-zoom-container, .pg-node-id-71, .pg-main-cs-4 { width: 100%; height: 100%; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; text-align: center; } .swiper-zoom-container > canvas, .swiper-zoom-container > img, .swiper-zoom-container > svg, .pg-node-id-72, .pg-main-cs-4 { max-width: 100%; max-height: 100%; -o-object-fit: contain; object-fit: contain; } .swiper-slide-zoomed, .pg-node-id-73, .pg-main-cs-4 { cursor: move; } .swiper-lazy-preloader, .pg-node-id-74, .pg-main-cs-4 { width: 42px; height: 42px; position: absolute; left: 50%; top: 50%; margin-left: -21px; margin-top: -21px; z-index: 10; -webkit-transform-origin: 50%; -ms-transform-origin: 50%; transform-origin: 50%; -webkit-animation: swiper-preloader-spin 1s steps(12, end) infinite; animation: swiper-preloader-spin 1s steps(12, end) infinite; } .swiper-lazy-preloader:after, .pg-node-id-75, .pg-main-cs-4 { display: block; content: ''; width: 100%; height: 100%; background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20viewBox%3D'0%200%20120%20120'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20xmlns%3Axlink%3D'http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink'%3E%3Cdefs%3E%3Cline%20id%3D'l'%20x1%3D'60'%20x2%3D'60'%20y1%3D'7'%20y2%3D'27'%20stroke%3D'%236c6c6c'%20stroke-width%3D'11'%20stroke-linecap%3D'round'%2F%3E%3C%2Fdefs%3E%3Cg%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(30%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(60%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(90%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(120%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(150%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.37'%20transform%3D'rotate(180%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.46'%20transform%3D'rotate(210%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.56'%20transform%3D'rotate(240%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.66'%20transform%3D'rotate(270%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.75'%20transform%3D'rotate(300%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.85'%20transform%3D'rotate(330%2060%2C60)'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E"); background-position: 50%; background-size: 100%; background-repeat: no-repeat; } .swiper-lazy-preloader-white:after, .pg-node-id-76, .pg-main-cs-4 { background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20viewBox%3D'0%200%20120%20120'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20xmlns%3Axlink%3D'http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink'%3E%3Cdefs%3E%3Cline%20id%3D'l'%20x1%3D'60'%20x2%3D'60'%20y1%3D'7'%20y2%3D'27'%20stroke%3D'%23fff'%20stroke-width%3D'11'%20stroke-linecap%3D'round'%2F%3E%3C%2Fdefs%3E%3Cg%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(30%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(60%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(90%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(120%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(150%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.37'%20transform%3D'rotate(180%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.46'%20transform%3D'rotate(210%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.56'%20transform%3D'rotate(240%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.66'%20transform%3D'rotate(270%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.75'%20transform%3D'rotate(300%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.85'%20transform%3D'rotate(330%2060%2C60)'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E"); } @-webkit-keyframes swiper-preloader-spin { 100% { -webkit-transform: rotate(360deg); transform: rotate(360deg); } } @keyframes swiper-preloader-spin { 100% { -webkit-transform: rotate(360deg); transform: rotate(360deg); } } .swiper-container .swiper-notification, .pg-node-id-77, .pg-main-cs-4 { position: absolute; left: 0; top: 0; pointer-events: none; opacity: 0; z-index: -1000; } .swiper-container-fade.swiper-container-free-mode .swiper-slide, .pg-node-id-78, .pg-main-cs-4 { -webkit-transition-timing-function: ease-out; -o-transition-timing-function: ease-out; transition-timing-function: ease-out; } .swiper-container-fade .swiper-slide, .pg-node-id-79, .pg-main-cs-4 { pointer-events: none; -webkit-transition-property: opacity; -o-transition-property: opacity; transition-property: opacity; } .swiper-container-fade .swiper-slide .swiper-slide, .pg-node-id-80, .pg-main-cs-4 { pointer-events: none; } .swiper-container-fade .swiper-slide-active, .swiper-container-fade .swiper-slide-active .swiper-slide-active, .pg-node-id-81, .pg-main-cs-4 { pointer-events: auto; } .swiper-container-cube, .pg-node-id-82, .pg-main-cs-4 { overflow: visible; } .swiper-container-cube .swiper-slide, .pg-node-id-83, .pg-main-cs-4 { pointer-events: none; -webkit-backface-visibility: hidden; backface-visibility: hidden; z-index: 1; visibility: hidden; -webkit-transform-origin: 0 0; -ms-transform-origin: 0 0; transform-origin: 0 0; width: 100%; height: 100%; } .swiper-container-cube .swiper-slide .swiper-slide, .pg-node-id-84, .pg-main-cs-4 { pointer-events: none; } .swiper-container-cube.swiper-container-rtl .swiper-slide, .pg-node-id-85, .pg-main-cs-4 { -webkit-transform-origin: 100% 0; -ms-transform-origin: 100% 0; transform-origin: 100% 0; } .swiper-container-cube .swiper-slide-active, .swiper-container-cube .swiper-slide-active .swiper-slide-active, .pg-node-id-86, .pg-main-cs-4 { pointer-events: auto; } .swiper-container-cube .swiper-slide-active, .swiper-container-cube .swiper-slide-next, .swiper-container-cube .swiper-slide-next + .swiper-slide, .swiper-container-cube .swiper-slide-prev, .pg-node-id-87, .pg-main-cs-4 { pointer-events: auto; visibility: visible; } .swiper-container-cube .swiper-slide-shadow-bottom, .swiper-container-cube .swiper-slide-shadow-left, .swiper-container-cube .swiper-slide-shadow-right, .swiper-container-cube .swiper-slide-shadow-top, .pg-node-id-88, .pg-main-cs-4 { z-index: 0; -webkit-backface-visibility: hidden; backface-visibility: hidden; } .swiper-container-cube .swiper-cube-shadow, .pg-node-id-89, .pg-main-cs-4 { position: absolute; left: 0; bottom: 0; width: 100%; height: 100%; background: #000; opacity: .6; -webkit-filter: blur(50px); filter: blur(50px); z-index: 0; } .swiper-container-flip, .pg-node-id-90, .pg-main-cs-4 { overflow: visible; } .swiper-container-flip .swiper-slide, .pg-node-id-91, .pg-main-cs-4 { pointer-events: none; -webkit-backface-visibility: hidden; backface-visibility: hidden; z-index: 1; } .swiper-container-flip .swiper-slide .swiper-slide, .pg-node-id-92, .pg-main-cs-4 { pointer-events: none; } .swiper-container-flip .swiper-slide-active, .swiper-container-flip .swiper-slide-active .swiper-slide-active, .pg-node-id-93, .pg-main-cs-4 { pointer-events: auto; } .swiper-container-flip .swiper-slide-shadow-bottom, .swiper-container-flip .swiper-slide-shadow-left, .swiper-container-flip .swiper-slide-shadow-right, .swiper-container-flip .swiper-slide-shadow-top, .pg-node-id-94, .pg-main-cs-4 { z-index: 0; -webkit-backface-visibility: hidden; backface-visibility: hidden; } .swiper-container-coverflow .swiper-wrapper, .pg-node-id-95, .pg-main-cs-4 { -ms-perspective: 1200px; } @charset "UTF-8"; /* 给 nav.scss */ html, body, .pg-node-id-96, .pg-main-cs-4 { overflow: initial; } html::-webkit-scrollbar, body::-webkit-scrollbar, .pg-node-id-97, .pg-main-cs-4 { display: none; } html, .pg-node-id-98, .pg-main-cs-4 { position: relative; height: 100%; scrollbar-width: none; /* firefox */ -ms-overflow-style: none; /* IE 10+ */ overflow: hidden; overflow-y: hidden; } body, .pg-node-id-99, .pg-main-cs-4 { position: relative; height: 100%; width: 100%; color: #fff; } footer, .pg-node-id-100, .pg-main-cs-4 { display: none; } .swiper-container, .pg-node-id-101, .pg-main-cs-4 { position: fixed; top: 0; width: 100%; z-index: 11; opacity: 0; pointer-events: none; } .swiper-container, .swiper-wrapper, .pg-node-id-102, .pg-main-cs-4 { height: 100vh !important; } .swiper-slide, .pg-node-id-103, .pg-main-cs-4 { height: 100vh; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; color: #fff; } .swiper-pagination, .pg-node-id-104, .pg-main-cs-4 { opacity: 0; } @media screen and (max-width: 1023px) { .module-dia1, .pg-node-id-105, .pg-main-cs-4 { display: none; position: fixed; top: 0; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); width: 100vw; height: 100vh; background-color: rgba(0, 0, 0, 0.95); z-index: 9999; } .module-dia1 .dia-con, .pg-node-id-106, .pg-main-cs-4 { position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); width: 88.88889vw; height: 56.11111vw; } .module-dia1 .dia-con video, .pg-node-id-107, .pg-main-cs-4 { width: 88.88889vw; height: 56.11111vw; } .module-dia1 .dia-con .dia-close, .pg-node-id-108, .pg-main-cs-4 { position: absolute; right: 0; top: -18%; font-size: 8.33333vw; color: #fff; } } @media screen and (min-width: 1024px) { .module-dia1, .pg-node-id-109, .pg-main-cs-4 { display: none; position: fixed; top: 0; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); width: 100vw; height: 100vh; background-color: rgba(0, 0, 0, 0.95); z-index: 9999; } .module-dia1 .dia-con, .pg-node-id-110, .pg-main-cs-4 { position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); width: 68.33333vw; height: 38.4375vw; } .module-dia1 .dia-con video, .pg-node-id-111, .pg-main-cs-4 { width: 68.33333vw; height: 38.4375vw; } .module-dia1 .dia-con .dia-close, .pg-node-id-112, .pg-main-cs-4 { position: absolute; right: 0; top: -8%; font-size: 2.60417vw; color: #fff; } } /* 加深层级 */ #main-wrapper, .pg-node-id-113, .pg-main-cs-4 { width: 100%; height: calc(100%); padding-top: 0px !important; /******** lazysizes CSS ********/ /******** Reset ********/ /******** SVG ********/ /******** Component ********/ /******** Font Set ********/ /* 统一字体类名 */ /* Desktop */ /* Tablet */ /* Phone */ /******** Match Media ********/ } #main-wrapper picture, .pg-node-id-114, .pg-main-cs-4 { display: block; font-size: 0; } #main-wrapper picture img, .pg-node-id-115, .pg-main-cs-4 { width: 100%; } #main-wrapper .lazyload, #main-wrapper .lazyloading, #main-wrapper .lazyloaded, .pg-node-id-116, .pg-main-cs-4 { opacity: 1; } #main-wrapper .main-box, .pg-node-id-117, .pg-main-cs-4 { z-index: 1; overflow-x: hidden; overflow-y: hidden; background: #000; } #main-wrapper .second-nav-bar, .pg-node-id-118, .pg-main-cs-4 { position: relative; z-index: 2; } #main-wrapper .dialogs-wrapper, .pg-node-id-119, .pg-main-cs-4 { position: fixed; z-index: 3; } #main-wrapper .clearfix, .pg-node-id-120, .pg-main-cs-4 { zoom: 1; display: table; width: 100%; } #main-wrapper .icon-play-video, .pg-node-id-121, .pg-main-cs-4 { display: block; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='60' height='60' viewBox='0 0 60 60'%3E%3Ccircle cx='30' cy='30' r='29' fill='none' stroke='%23fff' stroke-width='2'/%3E%3Cpath d='M38.44 29a1.22 1.22 0 010 2.06l-11.61 7.6a1.26 1.26 0 01-2-1V22.4a1.26 1.26 0 012-1z' fill='%23fff'/%3E%3C/svg%3E") 0 0/100% 100% no-repeat; } #main-wrapper .icon-swiper-prev, .pg-node-id-122, .pg-main-cs-4 { display: block; background: url("data:image/svg+xml,%3Csvg width='40' height='40' viewBox='0 0 40 40' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M40 20C40 9.015 31.087 0 20 0S0 9.015 0 20s8.913 20 20 20 20-9.015 20-20zM1.702 20C1.702 9.919 9.89 1.702 20 1.702 30.11 1.702 38.298 9.92 38.298 20c0 10.081-8.188 18.298-18.298 18.298C9.89 38.298 1.702 30.08 1.702 20zm14.508 3.058a.851.851 0 1 1-1.204 1.203L11 20.255l4.006-4.006a.851.851 0 1 1 1.204 1.204L14.18 19.48h14.193c.47 0 .47 1.703 0 1.703H14.335l1.875 1.874z' fill='%23fff'/%3E%3C/svg%3E") 0 0/100% 100% no-repeat; } #main-wrapper .icon-swiper-next, .pg-node-id-123, .pg-main-cs-4 { display: block; background: url("data:image/svg+xml,%3Csvg width='40' height='40' viewBox='0 0 40 40' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M40 20C40 9.015 31.087 0 20 0S0 9.015 0 20s8.913 20 20 20 20-9.015 20-20zM1.702 20C1.702 9.919 9.89 1.702 20 1.702 30.11 1.702 38.298 9.92 38.298 20c0 10.081-8.188 18.298-18.298 18.298C9.89 38.298 1.702 30.08 1.702 20zm21.815 3.058a.851.851 0 0 0 1.203 1.203l4.007-4.006-4.007-4.006a.851.851 0 1 0-1.203 1.204l2.028 2.028H11.352c-.47 0-.47 1.703 0 1.703h14.04l-1.875 1.874z' fill='%23fff' opacity='.78'/%3E%3C/svg%3E") 0 0/100% 100% no-repeat; } #main-wrapper .second-nav-bar, .pg-node-id-124, .pg-main-cs-4 { height: 61px; background: #fff; position: -webkit-sticky; position: sticky; top: -1px; border-bottom: 1px solid rgba(0, 0, 0, 0.1); font-size: 0; } #main-wrapper .second-nav-bar .nav-left-link, #main-wrapper .second-nav-bar .nav-center-link, .pg-node-id-125, .pg-main-cs-4 { color: rgba(0, 0, 0, 0.8); } #main-wrapper .snb-center-box, .pg-node-id-126, .pg-main-cs-4 { height: 100%; padding: 0 20px 0 16px; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } #main-wrapper .snb-center-box .nav-left, .pg-node-id-127, .pg-main-cs-4 { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; } #main-wrapper .snb-center-box .nav-left .nav-left-link, .pg-node-id-128, .pg-main-cs-4 { border-right: 1px solid rgba(0, 0, 0, 0.1); } #main-wrapper .snb-center-box .nav-left .nav-left-link:last-child, .pg-node-id-129, .pg-main-cs-4 { padding-right: 0; margin-right: 0; border: none; } #main-wrapper .snb-center-box .nav-center, .pg-node-id-130, .pg-main-cs-4 { margin-left: auto; } #main-wrapper .snb-center-box .nav-center .nav-center-link, .pg-node-id-131, .pg-main-cs-4 { position: relative; height: 100%; } #main-wrapper .snb-center-box .nav-center .nav-center-link::after, .pg-node-id-132, .pg-main-cs-4 { content: ''; display: block; width: 100%; height: 0; background: #00b6d2; position: absolute; bottom: -1px; left: 0; -webkit-transition: height 0.3s ease; transition: height 0.3s ease; } #main-wrapper .snb-center-box .nav-center .nav-center-link.on::after, .pg-node-id-133, .pg-main-cs-4 { height: 4px; } @media (min-width: 1600px) { #main-wrapper .snb-center-box .nav-left, .pg-node-id-134, .pg-main-cs-4 { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; } #main-wrapper .snb-center-box .nav-left .nav-left-link, .pg-node-id-135, .pg-main-cs-4 { padding-right: 11px; margin-right: 10px; } #main-wrapper .snb-center-box .nav-left .btn-show-center, .pg-node-id-136, .pg-main-cs-4 { display: none; } #main-wrapper .snb-center-box .nav-center .nav-center-links-box, .pg-node-id-137, .pg-main-cs-4 { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; height: 100%; } #main-wrapper .snb-center-box .nav-center .nav-center-link, .pg-node-id-138, .pg-main-cs-4 { line-height: 60px; margin: 0 10px; } #main-wrapper .snb-center-box .nav-right, .pg-node-id-139, .pg-main-cs-4 { margin-left: 38px; } #main-wrapper .snb-center-box .nav-right a.btn-nav-buy, .pg-node-id-140, .pg-main-cs-4 { text-align: center; line-height: 44px; display: block; width: 120px; height: 44px; border-radius: 2px; background: #00b6d2; color: #fff; } } @media (max-width: 1599px) and (min-width: 769px) { #main-wrapper .snb-center-box .nav-left, .pg-node-id-141, .pg-main-cs-4 { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; } #main-wrapper .snb-center-box .nav-left .nav-left-link, .pg-node-id-142, .pg-main-cs-4 { padding-right: 11px; margin-right: 10px; } #main-wrapper .snb-center-box .nav-left .btn-show-center, .pg-node-id-143, .pg-main-cs-4 { display: none; } #main-wrapper .snb-center-box .nav-center .nav-center-links-box, .pg-node-id-144, .pg-main-cs-4 { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; height: 100%; } #main-wrapper .snb-center-box .nav-center .nav-center-link, .pg-node-id-145, .pg-main-cs-4 { line-height: 60px; margin: 0 10px; } #main-wrapper .snb-center-box .nav-right, .pg-node-id-146, .pg-main-cs-4 { margin-left: 38px; } #main-wrapper .snb-center-box .nav-right a.btn-nav-buy, .pg-node-id-147, .pg-main-cs-4 { text-align: center; line-height: 44px; display: block; width: 120px; height: 44px; border-radius: 2px; background: #00b6d2; color: #fff; } } @media (max-width: 768px) { #main-wrapper, .pg-node-id-148, .pg-main-cs-4 { /* nav 样式 */ } #main-wrapper .second-nav-bar, .pg-node-id-149, .pg-main-cs-4 { height: 51px; /* 字号覆盖 */ } #main-wrapper .second-nav-bar .font-display, .pg-node-id-150, .pg-main-cs-4 { font-size: 52px; } #main-wrapper .second-nav-bar .font-headline-4, .pg-node-id-151, .pg-main-cs-4 { font-size: 32px; } #main-wrapper .second-nav-bar .font-headline-3, .pg-node-id-152, .pg-main-cs-4 { font-size: 28px; } #main-wrapper .second-nav-bar .font-headline-2, .pg-node-id-153, .pg-main-cs-4 { font-size: 28px; } #main-wrapper .second-nav-bar .font-headline-1, .pg-node-id-154, .pg-main-cs-4 { font-size: 20px; } #main-wrapper .second-nav-bar .font-title, .pg-node-id-155, .pg-main-cs-4 { font-size: 20px; } #main-wrapper .second-nav-bar .font-subheading, .pg-node-id-156, .pg-main-cs-4 { font-size: 18px; } #main-wrapper .second-nav-bar .font-subtitle, .pg-node-id-157, .pg-main-cs-4 { font-size: 16px; } #main-wrapper .second-nav-bar .font-body-2, .pg-node-id-158, .pg-main-cs-4 { font-size: 16px; } #main-wrapper .second-nav-bar .font-body-1, .pg-node-id-159, .pg-main-cs-4 { font-size: 14px; } #main-wrapper .second-nav-bar .font-descriptions, .pg-node-id-160, .pg-main-cs-4 { font-size: 12px; } #main-wrapper .snb-center-box, .pg-node-id-161, .pg-main-cs-4 { padding: 0 12px 0 18px; height: 51px; position: relative; top: -1px; left: 0; right: 0; background: #fff; border-bottom: 1px solid rgba(0, 0, 0, 0.1); } #main-wrapper .snb-center-box .nav-left .nav-left-link, .pg-node-id-162, .pg-main-cs-4 { line-height: 25px; height: 25px; } #main-wrapper .snb-center-box .nav-left .btn-show-center, .pg-node-id-163, .pg-main-cs-4 { width: 23px; height: 23px; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } #main-wrapper .snb-center-box .nav-left .btn-show-center svg, .pg-node-id-164, .pg-main-cs-4 { -webkit-transform-origin: 50% 50%; transform-origin: 50% 50%; -webkit-transform: rotate(180deg); transform: rotate(180deg); } #main-wrapper .snb-center-box .nav-center, .pg-node-id-165, .pg-main-cs-4 { width: 100%; height: 52px; -webkit-box-sizing: border-box; box-sizing: border-box; padding: 0 18px; border-top: 1px solid rgba(0, 0, 0, 0.1); border-bottom: 1px solid rgba(0, 0, 0, 0.1); background: #fff; position: absolute; top: 100%; left: 0; opacity: 0; pointer-events: none; -webkit-transition: opacity 0.6s ease; transition: opacity 0.6s ease; } #main-wrapper .snb-center-box .nav-center .nav-center-links-box, .pg-node-id-166, .pg-main-cs-4 { height: 100%; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; } #main-wrapper .snb-center-box .nav-center .nav-center-link, .pg-node-id-167, .pg-main-cs-4 { font-size: 14px; height: 100%; margin-right: 20px; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } #main-wrapper .snb-center-box .nav-center .nav-center-link:last-child, .pg-node-id-168, .pg-main-cs-4 { margin-right: 0; } #main-wrapper .snb-center-box .nav-center .nav-center-link.on::after, .pg-node-id-169, .pg-main-cs-4 { display: none; } #main-wrapper .snb-center-box .nav-right a.btn-nav-buy, .pg-node-id-170, .pg-main-cs-4 { text-align: center; font-size: 12px; line-height: 32px; display: block; width: 80px; height: 32px; border-radius: 2px; background: #00b6d2; color: #fff; } #main-wrapper .second-nav-bar.on .snb-center-box .nav-left .btn-show-center svg, .pg-node-id-171, .pg-main-cs-4 { -webkit-transform: rotate(0deg); transform: rotate(0deg); } #main-wrapper .second-nav-bar.on .snb-center-box .nav-center, .pg-node-id-172, .pg-main-cs-4 { opacity: 1; pointer-events: all; } } #main-wrapper .module-nav-bar, .pg-node-id-173, .pg-main-cs-4 { position: absolute; top: 0; height: 60px; width: 100%; z-index: 999; -webkit-transition: all 0.15s; transition: all 0.15s; overflow-y: hidden; overflow-x: scroll; border-bottom: 1px solid rgba(255, 255, 255, 0.1); } @media screen and (max-width: 1023px) { #main-wrapper .module-nav-bar, .pg-node-id-174, .pg-main-cs-4 { top: 0; background-color: rgba(0, 0, 0, 0.8); } } #main-wrapper .module-nav-bar::-webkit-scrollbar, .pg-node-id-175, .pg-main-cs-4 { display: none; } #main-wrapper .module-nav-bar::-webkit-scrollbar-thumb, .pg-node-id-176, .pg-main-cs-4 { display: none; } #main-wrapper .module-nav-bar ul, .pg-node-id-177, .pg-main-cs-4 { display: inline-block; white-space: nowrap; padding-bottom: 14px; border-bottom: 2px solid #191919; } #main-wrapper .module-nav-bar li, .pg-node-id-178, .pg-main-cs-4 { display: inline-block; } #main-wrapper .module-nav-bar li a, .pg-node-id-179, .pg-main-cs-4 { display: inline-block; padding: 20px 20px 0 20px; } #main-wrapper .module-nav-bar li span, .pg-node-id-180, .pg-main-cs-4 { color: #969696; } #main-wrapper .module-nav-bar li.on span, .pg-node-id-181, .pg-main-cs-4 { display: inline-block; line-height: 26px; font-size: 18px; color: #FAFAFA; border-bottom: 2px solid #fff; } #main-wrapper .module-nav-bar li:nth-child(1).on span, .pg-node-id-182, .pg-main-cs-4 { color: #FAFAFA; border-bottom: 2px solid #fff; } #main-wrapper .module-nav-bar li:nth-child(2).on span, .pg-node-id-183, .pg-main-cs-4 { color: #ff8000; border-bottom: 2px solid #ff8000; } #main-wrapper .module-nav-bar li:nth-child(3).on span, .pg-node-id-184, .pg-main-cs-4 { color: #39bf56; border-bottom: 2px solid #39bf56; } #main-wrapper .module-nav-bar li:nth-child(4).on span, .pg-node-id-185, .pg-main-cs-4 { color: #6d48ff; border-bottom: 2px solid #6d48ff; } #main-wrapper .module-nav-bar li:nth-child(5).on span, .pg-node-id-186, .pg-main-cs-4 { color: #4f67d2; border-bottom: 2px solid #4f67d2; } #main-wrapper .dialogs-wrapper, .pg-node-id-187, .pg-main-cs-4 { width: 100%; height: 100%; top: 100%; left: 0; overflow: hidden; -webkit-transition: top 0.6s ease; transition: top 0.6s ease; } #main-wrapper .dialog-mask-bg, .pg-node-id-188, .pg-main-cs-4 { width: 100%; height: 100%; background: rgba(0, 0, 0, 0.8); position: absolute; top: 0; left: 0; outline: none; } #main-wrapper .dia-mas-bg-close, .pg-node-id-189, .pg-main-cs-4 { display: block; font-size: 0; width: 36px; height: 36px; position: absolute; top: 12px; right: 12px; background: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M11.126 12.188L6 17.314l1.06 1.06 5.127-5.126 5.127 5.127 1.06-1.06-5.126-5.128 5.127-5.126L17.314 6l-5.127 5.127L7.061 6 6 7.061l5.126 5.127z' fill='%23fff'/%3E%3C/svg%3E") 0 0/100% 100% no-repeat; } @media screen and (max-width: 768px) { #main-wrapper .dia-mas-bg-close, .pg-node-id-190, .pg-main-cs-4 { width: 6.66667vw; height: 6.66667vw; top: 2.22222vw; right: 2.22222vw; } } #main-wrapper .font-display, #main-wrapper .font-headline-4, #main-wrapper .font-headline-3, #main-wrapper .font-headline-2, #main-wrapper .font-headline-1, #main-wrapper .font-title, #main-wrapper .font-subheading, #main-wrapper .font-subtitle, #main-wrapper .font-body-2, #main-wrapper .font-body-1, #main-wrapper .font-descriptions, .pg-node-id-191, .pg-main-cs-4 { font-family: Roman-55,Helvetica Neue,Helvetica,Arial,sans-serif; line-height: 1.2; } #main-wrapper .font-display, .pg-node-id-192, .pg-main-cs-4 { font-size: 100px; line-height: 1; } #main-wrapper .font-headline-4, .pg-node-id-193, .pg-main-cs-4 { font-size: 60px; } #main-wrapper .font-headline-3, .pg-node-id-194, .pg-main-cs-4 { font-size: 48px; } #main-wrapper .font-headline-2, .pg-node-id-195, .pg-main-cs-4 { font-size: 40px; } #main-wrapper .font-headline-1, .pg-node-id-196, .pg-main-cs-4 { font-size: 30px; } #main-wrapper .font-title, .pg-node-id-197, .pg-main-cs-4 { font-size: 24px; } #main-wrapper .font-subheading, .pg-node-id-198, .pg-main-cs-4 { font-size: 20px; } #main-wrapper .font-subtitle, .pg-node-id-199, .pg-main-cs-4 { font-size: 18px; } #main-wrapper .font-body-2, .pg-node-id-200, .pg-main-cs-4 { font-size: 16px; } #main-wrapper .font-body-1, .pg-node-id-201, .pg-main-cs-4 { font-size: 14px; } #main-wrapper .font-descriptions, .pg-node-id-202, .pg-main-cs-4 { font-size: 12px; } @media (max-width: 1599px) and (min-width: 1440px) { #main-wrapper .font-display, .pg-node-id-203, .pg-main-cs-4 { font-size: 60px; line-height: 1; } #main-wrapper .font-headline-4, .pg-node-id-204, .pg-main-cs-4 { font-size: 36px; } #main-wrapper .font-headline-3, .pg-node-id-205, .pg-main-cs-4 { font-size: 34px; } #main-wrapper .font-headline-2, .pg-node-id-206, .pg-main-cs-4 { font-size: 32px; } #main-wrapper .font-headline-1, .pg-node-id-207, .pg-main-cs-4 { font-size: 24px; } #main-wrapper .font-title, .pg-node-id-208, .pg-main-cs-4 { font-size: 20px; } #main-wrapper .font-subheading, .pg-node-id-209, .pg-main-cs-4 { font-size: 18px; } #main-wrapper .font-subtitle, .pg-node-id-210, .pg-main-cs-4 { font-size: 16px; } #main-wrapper .font-body-2, .pg-node-id-211, .pg-main-cs-4 { font-size: 16px; } #main-wrapper .font-body-1, .pg-node-id-212, .pg-main-cs-4 { font-size: 14px; } #main-wrapper .font-descriptions, .pg-node-id-213, .pg-main-cs-4 { font-size: 12px; } } @media (max-width: 1439px) and (min-width: 769px) { #main-wrapper .font-display, .pg-node-id-214, .pg-main-cs-4 { font-size: 4.16667vw; line-height: 1; } #main-wrapper .font-headline-4, .pg-node-id-215, .pg-main-cs-4 { font-size: 2.5vw; } #main-wrapper .font-headline-3, .pg-node-id-216, .pg-main-cs-4 { font-size: 2.36111vw; } #main-wrapper .font-headline-2, .pg-node-id-217, .pg-main-cs-4 { font-size: 2.22222vw; } #main-wrapper .font-headline-1, .pg-node-id-218, .pg-main-cs-4 { font-size: 1.66667vw; } #main-wrapper .font-title, .pg-node-id-219, .pg-main-cs-4 { font-size: 1.38889vw; } #main-wrapper .font-subheading, .pg-node-id-220, .pg-main-cs-4 { font-size: 1.25vw; } #main-wrapper .font-subtitle, .pg-node-id-221, .pg-main-cs-4 { font-size: 1.11111vw; } #main-wrapper .font-body-2, .pg-node-id-222, .pg-main-cs-4 { font-size: 1.11111vw; } #main-wrapper .font-body-1, .pg-node-id-223, .pg-main-cs-4 { font-size: 0.97222vw; } #main-wrapper .font-descriptions, .pg-node-id-224, .pg-main-cs-4 { font-size: 0.83333vw; } } @media (max-width: 768px) { #main-wrapper .font-display, .pg-node-id-225, .pg-main-cs-4 { font-size: 13.05556vw; line-height: 1; } #main-wrapper .font-headline-4, .pg-node-id-226, .pg-main-cs-4 { font-size: 8.05556vw; } #main-wrapper .font-headline-3, .pg-node-id-227, .pg-main-cs-4 { font-size: 6.94444vw; } #main-wrapper .font-headline-2, .pg-node-id-228, .pg-main-cs-4 { font-size: 7.77778vw; } #main-wrapper .font-headline-1, .pg-node-id-229, .pg-main-cs-4 { font-size: 5.55556vw; } #main-wrapper .font-title, .pg-node-id-230, .pg-main-cs-4 { font-size: 5vw; } #main-wrapper .font-subheading, .pg-node-id-231, .pg-main-cs-4 { font-size: 5vw; } #main-wrapper .font-subtitle, .pg-node-id-232, .pg-main-cs-4 { font-size: 4.44444vw; } #main-wrapper .font-body-2, .pg-node-id-233, .pg-main-cs-4 { font-size: 4.44444vw; } #main-wrapper .font-body-1, .pg-node-id-234, .pg-main-cs-4 { font-size: 3.88889vw; } #main-wrapper .font-descriptions, .pg-node-id-235, .pg-main-cs-4 { font-size: 3.33333vw; } } @media screen and (min-width: 1024px) { #main-wrapper .main-box, .pg-node-id-236, .pg-main-cs-4 { position: fixed; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); width: 100%; height: calc(100%); } #main-wrapper .module, .pg-node-id-237, .pg-main-cs-4 { position: fixed !important; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); height: 56.25vw; } #main-wrapper .module-kv, .pg-node-id-238, .pg-main-cs-4 { background: #000; height: 56.25vw; } #main-wrapper .module-kv .module-bg, .pg-node-id-239, .pg-main-cs-4 { width: 100vw; height: 100%; opacity: 0; -webkit-transform: scale(0.35); transform: scale(0.35); -webkit-transition: all 1.5s; transition: all 1.5s; z-index: 1; } #main-wrapper .module-kv .module-bg .kv-circle, .pg-node-id-240, .pg-main-cs-4 { position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); width: 62.5vw; height: 56.25vw; z-index: 2; opacity: 0; } #main-wrapper .module-kv .module-bg .kv-bottom, .pg-node-id-241, .pg-main-cs-4 { position: absolute; bottom: 0; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); width: 100vw; height: 11.875vw; z-index: 3; opacity: 0; } #main-wrapper .module-kv .module-bg .kv-ding, .pg-node-id-242, .pg-main-cs-4 { position: absolute; top: 12.60417vw; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); width: 100vw; height: 48.85417vw; z-index: 1; opacity: 0; } #main-wrapper .module-kv .module-bg.on, .pg-node-id-243, .pg-main-cs-4 { opacity: 1; -webkit-transform: scale(1); transform: scale(1); -webkit-transition: all 1.5s; transition: all 1.5s; } #main-wrapper .module-kv .module-bg.on .kv-circle, .pg-node-id-244, .pg-main-cs-4 { opacity: 1; -webkit-transition: all 1.2s; transition: all 1.2s; } #main-wrapper .module-kv .module-bg.on .kv-bottom, .pg-node-id-245, .pg-main-cs-4 { opacity: 1; -webkit-transition: all 1.2s 1.2s; transition: all 1.2s 1.2s; } #main-wrapper .module-kv .module-bg.on .kv-ding, .pg-node-id-246, .pg-main-cs-4 { opacity: 1; -webkit-transition: all 1.2s 1.2s; transition: all 1.2s 1.2s; } #main-wrapper .module-kv .module-bg.cut, .pg-node-id-247, .pg-main-cs-4 { -webkit-transform: scale(3.3); transform: scale(3.3); -webkit-transition: opacity 1.4s, -webkit-transform 1.2s; transition: opacity 1.4s, -webkit-transform 1.2s; transition: opacity 1.4s, transform 1.2s; transition: opacity 1.4s, transform 1.2s, -webkit-transform 1.2s; } #main-wrapper .module-kv .module-bg.cut .kv-circle, .pg-node-id-248, .pg-main-cs-4 { -webkit-transform: translate(-50%, -50%) scale(3.3); transform: translate(-50%, -50%) scale(3.3); -webkit-transition: opacity 1.4s, -webkit-transform 1.2s; transition: opacity 1.4s, -webkit-transform 1.2s; transition: opacity 1.4s, transform 1.2s; transition: opacity 1.4s, transform 1.2s, -webkit-transform 1.2s; } #main-wrapper .module-kv .module-bg.cut .kv-bottom, .pg-node-id-249, .pg-main-cs-4 { opacity: 0; -webkit-transition: all 0s 0s; transition: all 0s 0s; } #main-wrapper .module-kv .module-bg.cut .kv-ding, .pg-node-id-250, .pg-main-cs-4 { opacity: 0; -webkit-transition: all 0s 0s; transition: all 0s 0s; } #main-wrapper .module-kv .module-inner, .pg-node-id-251, .pg-main-cs-4 { height: 56.25vw; z-index: 2; } #main-wrapper .module-kv .module-inner .introduce-kv, .pg-node-id-252, .pg-main-cs-4 { position: absolute; left: -7.91667vw; top: 16.51042vw; width: 51.04167vw; color: #fff; z-index: 4; } #main-wrapper .module-kv .module-inner .introduce-kv .kv-type, .pg-node-id-253, .pg-main-cs-4 { font-size: 1.5625vw; line-height: 1.875vw; -webkit-transform: translateY(2.86458vw); transform: translateY(2.86458vw); } #main-wrapper .module-kv .module-inner .introduce-kv .kv-title, .pg-node-id-254, .pg-main-cs-4 { margin-top: 0.3125vw; font-size: 5.20833vw; line-height: 6.25vw; -webkit-transform: translateY(4.94792vw); transform: translateY(4.94792vw); } #main-wrapper .module-kv .module-inner .introduce-kv .kv-desc, .pg-node-id-255, .pg-main-cs-4 { width: 25vw; margin-top: 6.25vw; font-size: 0.9375vw; line-height: 1.14583vw; color: #D9D9D6; -webkit-transform: translateY(2.86458vw); transform: translateY(2.86458vw); } #main-wrapper .module-kv .module-inner.on .kv-type, .pg-node-id-256, .pg-main-cs-4 { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0); -webkit-transition: all 1.5s; transition: all 1.5s; } #main-wrapper .module-kv .module-inner.on .kv-title, .pg-node-id-257, .pg-main-cs-4 { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0); -webkit-transition: all 1.5s; transition: all 1.5s; } #main-wrapper .module-kv .module-inner.on .kv-desc, .pg-node-id-258, .pg-main-cs-4 { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0); -webkit-transition: all 1.5s; transition: all 1.5s; } #main-wrapper .module-kv .module-inner.cut .kv-type, .pg-node-id-259, .pg-main-cs-4 { opacity: 1; -webkit-transform: translateY(-3.125vw); transform: translateY(-3.125vw); -webkit-transition: all 1.2s; transition: all 1.2s; } #main-wrapper .module-kv .module-inner.cut .kv-title, .pg-node-id-260, .pg-main-cs-4 { opacity: 1; -webkit-transform: translateY(-5.20833vw); transform: translateY(-5.20833vw); -webkit-transition: all 1.2s; transition: all 1.2s; } #main-wrapper .module-kv .module-inner.cut .kv-desc, .pg-node-id-261, .pg-main-cs-4 { opacity: 1; -webkit-transform: translateY(-3.125vw); transform: translateY(-3.125vw); -webkit-transition: all 1.2s; transition: all 1.2s; } #main-wrapper .module-kv .introduce-bg, .pg-node-id-262, .pg-main-cs-4 { position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); width: 27.08333vw; opacity: 0; -webkit-transition: all 0.5s; transition: all 0.5s; } #main-wrapper .module-kv .introduce-bg.on, .pg-node-id-263, .pg-main-cs-4 { opacity: 1; } #main-wrapper .module-kv .btn-video-box, .pg-node-id-264, .pg-main-cs-4 { height: 2.5vw; margin-top: 2.08333vw; font-size: 1.25vw; line-height: 2.5vw; } #main-wrapper .module-kv .play-icon, .pg-node-id-265, .pg-main-cs-4 { width: 2.5vw; height: 2.5vw; margin-left: 1.04167vw; display: inline-block; vertical-align: middle; } #main-wrapper .module1, .pg-node-id-266, .pg-main-cs-4 { display: none; position: relative; width: 100%; height: 56.25vw; } #main-wrapper .module1 .module-bg2, .pg-node-id-267, .pg-main-cs-4 { display: none; } #main-wrapper .module1 .module-bg, .pg-node-id-268, .pg-main-cs-4 { position: relative; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; position: absolute; left: 50%; -webkit-transform: translateX(-50%) scale(1); transform: translateX(-50%) scale(1); width: 110.41667vw; height: 56.25vw; -webkit-transition: -webkit-transform 1s; transition: -webkit-transform 1s; transition: transform 1s; transition: transform 1s, -webkit-transform 1s; } #main-wrapper .module1 .module-bg .column-bg, .pg-node-id-269, .pg-main-cs-4 { width: 16.66667vw; height: 100%; -webkit-perspective: 36.45833vw; perspective: 36.45833vw; } #main-wrapper .module1 .module-bg .column-bg picture, .pg-node-id-270, .pg-main-cs-4 { opacity: 1; width: 16.66667vw; height: 35.625vw; margin-bottom: 2.08333vw; -webkit-transition: all 1.5s 0.2s; transition: all 1.5s 0.2s; } #main-wrapper .module1 .module-bg .column-bg picture:last-child, .pg-node-id-271, .pg-main-cs-4 { margin-bottom: 0vw; } #main-wrapper .module1 .module-bg .column-bg1, .pg-node-id-272, .pg-main-cs-4 { -webkit-transform: translateY(-9.63542vw); transform: translateY(-9.63542vw); } #main-wrapper .module1 .module-bg .column-bg2, .pg-node-id-273, .pg-main-cs-4 { -webkit-transform: translateY(-27.55208vw); transform: translateY(-27.55208vw); } #main-wrapper .module1 .module-bg .column-bg3, .pg-node-id-274, .pg-main-cs-4 { -webkit-transform: translateY(2.08333vw); transform: translateY(2.08333vw); } #main-wrapper .module1 .module-bg .column-bg4, .pg-node-id-275, .pg-main-cs-4 { -webkit-transform: translateY(-20.83333vw); transform: translateY(-20.83333vw); } #main-wrapper .module1 .module-bg .column-bg5, .pg-node-id-276, .pg-main-cs-4 { -webkit-transform: translateY(-27.34375vw); transform: translateY(-27.34375vw); } #main-wrapper .module1 .module-bg .column-bg6, .pg-node-id-277, .pg-main-cs-4 { -webkit-transform: translateY(-8.48958vw); transform: translateY(-8.48958vw); } #main-wrapper .module1 .module-bg .column-bg1 picture:nth-child(1), .pg-node-id-278, .pg-main-cs-4 { top: 9.63542vw; left: 0; } #main-wrapper .module1 .module-bg .column-bg1 picture:nth-child(2), .pg-node-id-279, .pg-main-cs-4 { top: 28.07292vw; left: 0; } #main-wrapper .module1 .module-bg.on, .pg-node-id-280, .pg-main-cs-4 { opacity: 1; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; position: absolute; left: 50%; -webkit-transform: translateX(-50%) scale(1); transform: translateX(-50%) scale(1); width: 110.41667vw; height: 56.25vw; } #main-wrapper .module1 .module-bg.on .column-bg picture, .pg-node-id-281, .pg-main-cs-4 { width: 16.66667vw; height: 35.625vw; margin-bottom: 2.08333vw; -webkit-transition: all 1s 0s; transition: all 1s 0s; } #main-wrapper .module1 .module-bg.on .column-bg:nth-child(1) picture:nth-child(1), .pg-node-id-282, .pg-main-cs-4 { opacity: 0.3; -webkit-transform: translate3d(65.88542vw, 10.98958vw, -81.14583vw); transform: translate3d(65.88542vw, 10.98958vw, -81.14583vw); } #main-wrapper .module1 .module-bg.on .column-bg:nth-child(1) picture:nth-child(2), .pg-node-id-283, .pg-main-cs-4 { opacity: 0.2; -webkit-transform: translate3d(50.26042vw, 26.61458vw, -66.14583vw); transform: translate3d(50.26042vw, 26.61458vw, -66.14583vw); } #main-wrapper .module1 .module-bg.on .column-bg:nth-child(2) picture:nth-child(1), .pg-node-id-284, .pg-main-cs-4 { opacity: 0.5; -webkit-transform: translate3d(50.26042vw, 52.65625vw, -81.14583vw); transform: translate3d(50.26042vw, 52.65625vw, -81.14583vw); } #main-wrapper .module1 .module-bg.on .column-bg:nth-child(2) picture:nth-child(2), .pg-node-id-285, .pg-main-cs-4 { opacity: 0.35; -webkit-transform: translate3d(37.86458vw, 59.84375vw, -66.14583vw); transform: translate3d(37.86458vw, 59.84375vw, -66.14583vw); } #main-wrapper .module1 .module-bg.on .column-bg:nth-child(2) picture:nth-child(3), .pg-node-id-286, .pg-main-cs-4 { opacity: 0.1; -webkit-transform: translate3d(50.26042vw, 73.48958vw, -66.14583vw); transform: translate3d(50.26042vw, 73.48958vw, -66.14583vw); } #main-wrapper .module1 .module-bg.on .column-bg:nth-child(3) picture:nth-child(1), .pg-node-id-287, .pg-main-cs-4 { opacity: 0.4; -webkit-transform: translate3d(21.09375vw, -4.63542vw, -90.52083vw); transform: translate3d(21.09375vw, -4.63542vw, -90.52083vw); } #main-wrapper .module1 .module-bg.on .column-bg:nth-child(3) picture:nth-child(2), .pg-node-id-288, .pg-main-cs-4 { opacity: 0.6; -webkit-transform: translate3d(29.42708vw, 6.71875vw, -92.1875vw); transform: translate3d(29.42708vw, 6.71875vw, -92.1875vw); } #main-wrapper .module1 .module-bg.on .column-bg:nth-child(4) picture:nth-child(1), .pg-node-id-289, .pg-main-cs-4 { opacity: 0.15; -webkit-transform: translate3d(0, 46.875vw, -139.53125vw); transform: translate3d(0, 46.875vw, -139.53125vw); } #main-wrapper .module1 .module-bg.on .column-bg:nth-child(4) picture:nth-child(2), .pg-node-id-290, .pg-main-cs-4 { opacity: 0.65; -webkit-transform: translate3d(-20.83333vw, 78.125vw, -155.15625vw); transform: translate3d(-20.83333vw, 78.125vw, -155.15625vw); } #main-wrapper .module1 .module-bg.on .column-bg:nth-child(4) picture:nth-child(3), .pg-node-id-291, .pg-main-cs-4 { opacity: 0.4; -webkit-transform: translate3d(36.45833vw, 36.45833vw, -66.61458vw); transform: translate3d(36.45833vw, 36.45833vw, -66.61458vw); } #main-wrapper .module1 .module-bg.on .column-bg:nth-child(5) picture:nth-child(1), .pg-node-id-292, .pg-main-cs-4 { opacity: 0.35; -webkit-transform: translate3d(-15.625vw, 145.83333vw, -139.53125vw); transform: translate3d(-15.625vw, 145.83333vw, -139.53125vw); } #main-wrapper .module1 .module-bg.on .column-bg:nth-child(5) picture:nth-child(2), .pg-node-id-293, .pg-main-cs-4 { opacity: 0.1; -webkit-transform: translate3d(-31.25vw, 52.08333vw, -139.53125vw); transform: translate3d(-31.25vw, 52.08333vw, -139.53125vw); } #main-wrapper .module1 .module-bg.on .column-bg:nth-child(5) picture:nth-child(3), .pg-node-id-294, .pg-main-cs-4 { opacity: 0.2; -webkit-transform: translate3d(-57.29167vw, 57.29167vw, -87.44792vw); transform: translate3d(-57.29167vw, 57.29167vw, -87.44792vw); } #main-wrapper .module1 .module-bg.on .column-bg:nth-child(6) picture:nth-child(1), .pg-node-id-295, .pg-main-cs-4 { opacity: 0.3; -webkit-transform: translate3d(-46.875vw, 0vw, -82.29167vw); transform: translate3d(-46.875vw, 0vw, -82.29167vw); } #main-wrapper .module1 .module-bg.on .column-bg:nth-child(6) picture:nth-child(2), .pg-node-id-296, .pg-main-cs-4 { opacity: 0.6; -webkit-transform: translate3d(-36.45833vw, 31.25vw, -82.29167vw); transform: translate3d(-36.45833vw, 31.25vw, -82.29167vw); } #main-wrapper .module1 .module-bg.small, .pg-node-id-297, .pg-main-cs-4 { -webkit-transform: translateX(-50%) scale(0.25); transform: translateX(-50%) scale(0.25); } #main-wrapper .module1 .module-bg2.small, .pg-node-id-298, .pg-main-cs-4 { -webkit-transform: translateX(-50%) scale(0.25); transform: translateX(-50%) scale(0.25); } #main-wrapper .module1 .module-bg.open .column-bg2, .pg-node-id-299, .pg-main-cs-4 { -webkit-transform: translateY(9.11458vw); transform: translateY(9.11458vw); -webkit-transition: -webkit-transform 1s; transition: -webkit-transform 1s; transition: transform 1s; transition: transform 1s, -webkit-transform 1s; } #main-wrapper .module1 .module-bg.open .column-bg3, .pg-node-id-300, .pg-main-cs-4 { -webkit-transform: translateY(46.875vw); transform: translateY(46.875vw); -webkit-transition: -webkit-transform 1s; transition: -webkit-transform 1s; transition: transform 1s; transition: transform 1s, -webkit-transform 1s; } #main-wrapper .module1 .module-bg.open .column-bg4 picture:nth-child(1), .pg-node-id-301, .pg-main-cs-4 { -webkit-transform: translateY(-47.39583vw); transform: translateY(-47.39583vw); -webkit-transition: -webkit-transform 1s; transition: -webkit-transform 1s; transition: transform 1s; transition: transform 1s, -webkit-transform 1s; } #main-wrapper .module1 .module-bg.open .column-bg4 picture:nth-child(2), .pg-node-id-302, .pg-main-cs-4 { -webkit-transform: translateY(-47.39583vw); transform: translateY(-47.39583vw); -webkit-transition: -webkit-transform 1s; transition: -webkit-transform 1s; transition: transform 1s; transition: transform 1s, -webkit-transform 1s; } #main-wrapper .module1 .module-bg.open .column-bg5 picture:nth-child(1), .pg-node-id-303, .pg-main-cs-4 { -webkit-transform: translateY(8.07292vw); transform: translateY(8.07292vw); -webkit-transition: -webkit-transform 1s; transition: -webkit-transform 1s; transition: transform 1s; transition: transform 1s, -webkit-transform 1s; } #main-wrapper .module1 .module-bg.open .column-bg5 picture:nth-child(2), .pg-node-id-304, .pg-main-cs-4 { -webkit-transform: translateY(8.07292vw); transform: translateY(8.07292vw); -webkit-transition: -webkit-transform 1s; transition: -webkit-transform 1s; transition: transform 1s; transition: transform 1s, -webkit-transform 1s; } #main-wrapper .module1 .module-bg.open .column-bg5 picture:nth-child(3), .pg-node-id-305, .pg-main-cs-4 { -webkit-transform: translateY(8.07292vw); transform: translateY(8.07292vw); -webkit-transition: -webkit-transform 1s; transition: -webkit-transform 1s; transition: transform 1s; transition: transform 1s, -webkit-transform 1s; } #main-wrapper .module1 .introduce, .pg-node-id-306, .pg-main-cs-4 { position: absolute; top: 18.02083vw; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); width: 27.08333vw; } #main-wrapper .module1 .introduce .base-desc, .pg-node-id-307, .pg-main-cs-4 { width: 27.08333vw; } #main-wrapper .module1 .introduce.on .base-title, .pg-node-id-308, .pg-main-cs-4 { opacity: 0; } #main-wrapper .module1 .introduce.on .base-desc, .pg-node-id-309, .pg-main-cs-4 { opacity: 0; } #main-wrapper .module1 .btn-video-box, .pg-node-id-310, .pg-main-cs-4 { height: 2.5vw; margin-top: 2.08333vw; opacity: 0; font-size: 1.25vw; line-height: 2.5vw; } #main-wrapper .module1 .play-icon, .pg-node-id-311, .pg-main-cs-4 { width: 2.5vw; height: 2.5vw; margin-left: 1.04167vw; display: inline-block; vertical-align: middle; } #main-wrapper .module2, .pg-node-id-312, .pg-main-cs-4 { display: none; } #main-wrapper .module2 .module-bg, .pg-node-id-313, .pg-main-cs-4 { position: relative; width: 100%; height: 56.25vw; -webkit-transform-origin: left bottom; transform-origin: left bottom; background-color: #1C0500; } #main-wrapper .module2 .module-bg .wall, .pg-node-id-314, .pg-main-cs-4 { position: absolute; top: 12.55208vw; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); width: 34.21875vw; height: 31.04167vw; } #main-wrapper .module2 .module-bg .floor1, .pg-node-id-315, .pg-main-cs-4 { position: absolute; bottom: 0; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); width: 100vw; height: 12.65625vw; } #main-wrapper .module2 .module-bg .floor2, .pg-node-id-316, .pg-main-cs-4 { position: absolute; bottom: 0; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); width: 100vw; height: 23.07292vw; -webkit-filter: saturate(300%); filter: saturate(300%); } #main-wrapper .module2 .module-bg .bg-shadow, .pg-node-id-317, .pg-main-cs-4 { position: absolute; bottom: 0; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); width: 100vw; height: 12.60417vw; } #main-wrapper .module2 .module-bg.on, .pg-node-id-318, .pg-main-cs-4 { position: relative; width: 100%; height: 56.25vw; -webkit-transform-origin: left bottom; transform-origin: left bottom; } #main-wrapper .module2 .module-inner, .pg-node-id-319, .pg-main-cs-4 { height: 56.25vw; } #main-wrapper .module2 .module-title > div, .pg-node-id-320, .pg-main-cs-4 { opacity: 0; } #main-wrapper .module3, .pg-node-id-321, .pg-main-cs-4 { display: none; position: relative; width: 100%; height: 56.25vw; z-index: 4; } #main-wrapper .module3 .module-inner, .pg-node-id-322, .pg-main-cs-4 { height: 56.25vw; } #main-wrapper .module3 .introduce, .pg-node-id-323, .pg-main-cs-4 { position: absolute; width: 32.29167vw; left: 39.84375vw; top: 22.96875vw; z-index: 4; } #main-wrapper .module3 .introduce .base-desc, .pg-node-id-324, .pg-main-cs-4 { width: 27.08333vw; } #main-wrapper .module3 .cartoon-box, .pg-node-id-325, .pg-main-cs-4 { position: absolute; top: 17.23958vw; left: -8.02083vw; width: 42.60417vw; height: 32.70833vw; } #main-wrapper .module3 .cartoon-box .cartoon-text, .pg-node-id-326, .pg-main-cs-4 { position: absolute; top: -2.5vw; left: -5.57292vw; width: 100%; font-size: 1.25vw; line-height: 1.51042vw; color: #fff; text-align: center; z-index: 4; } #main-wrapper .module3 .cartoon-box .black3, .pg-node-id-327, .pg-main-cs-4 { position: absolute; top: 0; right: 0; width: 17.29167vw; height: 15.9375vw; } #main-wrapper .module3 .cartoon-box .desk, .pg-node-id-328, .pg-main-cs-4 { position: absolute; bottom: 0; right: 13.54167vw; width: 7.39583vw; height: 14.47917vw; } #main-wrapper .module3 .cartoon-box .black4, .pg-node-id-329, .pg-main-cs-4 { position: absolute; top: 26.19792vw; left: 8.95833vw; width: 7.13542vw; height: 2.03125vw; } #main-wrapper .module3 .cartoon-box .black2, .pg-node-id-330, .pg-main-cs-4 { position: absolute; top: 25.625vw; right: 4.16667vw; width: 7.13542vw; height: 2.03125vw; } #main-wrapper .module3 .cartoon-box .black1, .pg-node-id-331, .pg-main-cs-4 { position: absolute; top: 22.86458vw; right: 1.45833vw; width: 7.13542vw; height: 2.03125vw; } #main-wrapper .module3 .cartoon-box .fallen1, .pg-node-id-332, .pg-main-cs-4 { position: absolute; top: 13.80208vw; width: 6.11979vw; height: 10.10417vw; } #main-wrapper .module3 .cartoon-box .fallen2, .pg-node-id-333, .pg-main-cs-4 { position: absolute; top: 12.76042vw; right: 3.85417vw; width: 3.02083vw; height: 5.33854vw; } #main-wrapper .module3 .cartoon-box .page, .pg-node-id-334, .pg-main-cs-4 { position: absolute; top: 5.72917vw; left: 10.78125vw; width: 10.78125vw; height: 9.50521vw; z-index: 2; } #main-wrapper .module3 .cartoon-box .person, .pg-node-id-335, .pg-main-cs-4 { position: absolute; top: 3.85417vw; left: 14.84375vw; width: 14.03646vw; height: 28.98438vw; } #main-wrapper .module4, .pg-node-id-336, .pg-main-cs-4 { display: none; position: relative; width: 100%; height: 56.25vw; } #main-wrapper .module4 .module-inner, .pg-node-id-337, .pg-main-cs-4 { height: 56.25vw; } #main-wrapper .module4 .introduce, .pg-node-id-338, .pg-main-cs-4 { position: absolute; width: 32.29167vw; left: 39.84375vw; top: 22.96875vw; z-index: 4; opacity: 0; } #main-wrapper .module4 .introduce .base-desc, .pg-node-id-339, .pg-main-cs-4 { width: 27.08333vw; } #main-wrapper .module4 .cartoon-box, .pg-node-id-340, .pg-main-cs-4 { position: absolute; left: -16.40625vw; top: 0; width: 56.40625vw; height: 46.82292vw; } #main-wrapper .module4 .cartoon-box .cartoon-text, .pg-node-id-341, .pg-main-cs-4 { position: absolute; top: 13.69792vw; left: -9.6875vw; width: 100%; font-size: 1.25vw; line-height: 1.51042vw; color: #fff; text-align: center; } #main-wrapper .module4 .cartoon-box .cartoon-box2-pic, .pg-node-id-342, .pg-main-cs-4 { position: absolute; top: 0; left: 0; width: 71.51042vw; height: 56.25vw; } #main-wrapper .module4 .cartoon-box .leaf1, .pg-node-id-343, .pg-main-cs-4 { display: none; position: absolute; left: 0; top: 0; width: 10.98958vw; height: 17.05729vw; } #main-wrapper .module4 .cartoon-box .leaf2, .pg-node-id-344, .pg-main-cs-4 { display: none; position: absolute; left: 0; top: 2.60417vw; width: 0.72917vw; height: 16.22396vw; } #main-wrapper .module4 .cartoon-box .cloud1, .pg-node-id-345, .pg-main-cs-4 { display: none; position: absolute; left: 5.88542vw; top: 17.03125vw; width: 4.53125vw; height: 3.125vw; } #main-wrapper .module4 .cartoon-box .cloud2, .pg-node-id-346, .pg-main-cs-4 { display: none; position: absolute; left: 20.41667vw; top: 3.33333vw; width: 11.30208vw; height: 5.98958vw; } #main-wrapper .module4 .cartoon-box .tree, .pg-node-id-347, .pg-main-cs-4 { display: none; position: absolute; right: 0; top: 0; width: 23.95833vw; height: 29.84375vw; } #main-wrapper .module4 .cartoon-box .grass1, .pg-node-id-348, .pg-main-cs-4 { display: none; position: absolute; left: 0; bottom: 0; width: 7.55208vw; height: 3.90625vw; } #main-wrapper .module4 .cartoon-box .grass2, .pg-node-id-349, .pg-main-cs-4 { display: none; position: absolute; right: 11.14583vw; bottom: 0.625vw; width: 10.96354vw; height: 4.01042vw; } #main-wrapper .module4 .cartoon-box .person, .pg-node-id-350, .pg-main-cs-4 { display: none; position: absolute; top: 10.3125vw; right: 80; width: 52.44792vw; height: 26.66667vw; } #main-wrapper .module5, .pg-node-id-351, .pg-main-cs-4 { display: none; position: relative; width: 100%; height: 56.25vw; } #main-wrapper .module5 .module-inner, .pg-node-id-352, .pg-main-cs-4 { height: 56.25vw; } #main-wrapper .module5 .introduce, .pg-node-id-353, .pg-main-cs-4 { position: absolute; top: 24.27083vw; left: 0; width: 27.08333vw; z-index: 4; } #main-wrapper .module5 .sec4-video, .pg-node-id-354, .pg-main-cs-4 { position: absolute; right: -16.66667vw; top: 0vw; width: 100vw; height: 56.25vw; } #main-wrapper .module5 .sec4-video picture, .pg-node-id-355, .pg-main-cs-4 { width: 100%; height: 100%; } #main-wrapper .module5 .sec4-video video, .pg-node-id-356, .pg-main-cs-4 { position: absolute; right: 10.57292vw; top: 50%; -webkit-transform: translate(0, -50%); transform: translate(0, -50%); width: 33.33333vw; height: 18.75vw; } #main-wrapper .module5 .sec4-video #m2-sec4-canvas, .pg-node-id-357, .pg-main-cs-4 { display: none; } #main-wrapper .module6, .pg-node-id-358, .pg-main-cs-4 { display: none; height: 100%; } #main-wrapper .module6 .module-inner, .pg-node-id-359, .pg-main-cs-4 { height: 100%; } #main-wrapper .module6 .introduce, .pg-node-id-360, .pg-main-cs-4 { position: absolute; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); right: 0; width: 27.08333vw; z-index: 4; } #main-wrapper .module6 .sec5-video, .pg-node-id-361, .pg-main-cs-4 { position: absolute; left: 0; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); width: 23.95833vw; height: 35.625vw; } #main-wrapper .module6 .sec5-video .module6-canvas, .pg-node-id-362, .pg-main-cs-4 { position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); width: 20.625vw; height: 20.625vw; } #main-wrapper .module6 .navigation, .pg-node-id-363, .pg-main-cs-4 { position: absolute; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); right: -16.40625vw; width: 56.71875vw; height: 30.46875vw; } #main-wrapper .module6 .navigation .location-path-box, .pg-node-id-364, .pg-main-cs-4 { position: absolute; top: 0vw; left: 3.48958vw; width: 54.11458vw; height: 43.28125vw; } #main-wrapper .module6 .navigation .location, .pg-node-id-365, .pg-main-cs-4 { position: absolute; width: 6.25vw; height: 6.25vw; left: 1.19792vw; top: 20.36458vw; } #main-wrapper .module7, .pg-node-id-366, .pg-main-cs-4 { display: none; } #main-wrapper .module7 .module-inner, .pg-node-id-367, .pg-main-cs-4 { height: 100%; } #main-wrapper .module7 .introduce, .pg-node-id-368, .pg-main-cs-4 { position: absolute; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); width: 27.08333vw; z-index: 4; } #main-wrapper .module7 .sec6-video, .pg-node-id-369, .pg-main-cs-4 { position: absolute; right: 7.8125vw; top: 10.3125vw; width: 16.66667vw; height: 35.625vw; } #main-wrapper .module7 .sec6-video .border, .pg-node-id-370, .pg-main-cs-4 { position: relative; z-index: 4; } #main-wrapper .module7 .sec6-video .v-cont, .pg-node-id-371, .pg-main-cs-4 { position: absolute; left: 50%; top: 50%; -webkit-transform: translate(-49.8%, -50%); transform: translate(-49.8%, -50%); width: 16.77083vw; z-index: 3; } #main-wrapper .module8, .pg-node-id-372, .pg-main-cs-4 { background-color: #000; display: none; } #main-wrapper .module8 .module-bg, .pg-node-id-373, .pg-main-cs-4 { -webkit-mask-image: none; mask-image: none; -webkit-mask-position: 0 0; mask-position: 0 0; } #main-wrapper .module8 .module-bg.on, .pg-node-id-374, .pg-main-cs-4 { -webkit-mask-image: -webkit-gradient(linear, left top, left bottom, color-stop(20%, black), color-stop(25%, rgba(0, 0, 0, 0))); -webkit-mask-image: linear-gradient(to bottom, black 20%, rgba(0, 0, 0, 0) 25%); mask-image: -webkit-gradient(linear, left top, left bottom, color-stop(20%, black), color-stop(25%, rgba(0, 0, 0, 0))); mask-image: linear-gradient(to bottom, black 20%, rgba(0, 0, 0, 0) 25%); -webkit-animation: greenBgMask 1.5s; animation: greenBgMask 1.5s; } #main-wrapper .module8 .module-bg.remove-ask, .pg-node-id-375, .pg-main-cs-4 { -webkit-mask-image: none; mask-image: none; -webkit-animation: none; animation: none; } @-webkit-keyframes greenBgMask { 0% { -webkit-mask-position: 0 -56.25vw; mask-position: 0 -56.25vw; } 100% { -webkit-mask-position: 0 0; mask-position: 0 0; } } @keyframes greenBgMask { 0% { -webkit-mask-position: 0 -56.25vw; mask-position: 0 -56.25vw; } 100% { -webkit-mask-position: 0 0; mask-position: 0 0; } } #main-wrapper .module9, .pg-node-id-376, .pg-main-cs-4 { display: none; } #main-wrapper .module9 .module-inner, .pg-node-id-377, .pg-main-cs-4 { height: 100%; } #main-wrapper .module9 .introduce, .pg-node-id-378, .pg-main-cs-4 { position: absolute; top: 16.5625vw; left: 0; width: 27.08333vw; } #main-wrapper .module9 .phone-box, .pg-node-id-379, .pg-main-cs-4 { position: absolute; right: -16.66667vw; height: 56.25vw; width: 51.875vw; } #main-wrapper .module9 .phone-box .opacity-box, .pg-node-id-380, .pg-main-cs-4 { position: absolute; display: inline-block; width: 16.66667vw; height: 35.625vw; margin-bottom: 2.08333vw; } #main-wrapper .module9 .phone-box picture, .pg-node-id-381, .pg-main-cs-4 { position: relative; width: 16.66667vw; height: 35.625vw; margin-bottom: 2.08333vw; z-index: 5; } #main-wrapper .module9 .phone-box .white-box, .pg-node-id-382, .pg-main-cs-4 { position: absolute; width: 15.26042vw; height: 33.90625vw; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); border-radius: 1.69271vw; background-color: #fff; z-index: 4; } #main-wrapper .module9 .phone-box .phone-top, .pg-node-id-383, .pg-main-cs-4 { position: relative; height: 29.16667vw; } #main-wrapper .module9 .phone-box .phone-top .opacity-box:nth-child(1), .pg-node-id-384, .pg-main-cs-4 { left: 0; bottom: 0; } #main-wrapper .module9 .phone-box .phone-top .opacity-box:nth-child(2), .pg-node-id-385, .pg-main-cs-4 { left: 18.75vw; bottom: -11.19792vw; } #main-wrapper .module9 .phone-box .phone-top .opacity-box:nth-child(3), .pg-node-id-386, .pg-main-cs-4 { left: 37.5vw; bottom: 0; } #main-wrapper .module9 .phone-box .phone-bottom, .pg-node-id-387, .pg-main-cs-4 { position: relative; height: 27.08333vw; } #main-wrapper .module9 .phone-box .phone-bottom .opacity-box:nth-child(1), .pg-node-id-388, .pg-main-cs-4 { top: 0; bottom: 0; } #main-wrapper .module9 .phone-box .phone-bottom .opacity-box:nth-child(2), .pg-node-id-389, .pg-main-cs-4 { left: 18.75vw; top: 11.19792vw; } #main-wrapper .module9 .phone-box .phone-bottom .opacity-box:nth-child(3), .pg-node-id-390, .pg-main-cs-4 { left: 37.5vw; top: 0; } #main-wrapper .module9 .tab-box, .pg-node-id-391, .pg-main-cs-4 { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-align-content: space-between; -ms-flex-line-pack: justify; align-content: space-between; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -webkit-flex-flow: row wrap; -ms-flex-flow: row wrap; flex-flow: row wrap; position: absolute; left: 0vw; top: 31.66667vw; width: 4.79167vw; height: 6.82292vw; padding-left: 1.35417vw; font-size: 0.72917vw; line-height: 0.88542vw; } #main-wrapper .module9 .tab-box .line, .pg-node-id-392, .pg-main-cs-4 { position: absolute; left: 0; width: 0.83333vw; height: 0.05208vw; background-color: #fff; } #main-wrapper .module9 .tab-box .tab-item, .pg-node-id-393, .pg-main-cs-4 { opacity: 0.4; cursor: pointer; } #main-wrapper .module9 .tab-box .tab-item.on, .pg-node-id-394, .pg-main-cs-4 { opacity: 1; } #main-wrapper .module9 .tab-box.on1 .line, .pg-node-id-395, .pg-main-cs-4 { top: 0.41667vw; } #main-wrapper .module9 .tab-box.on1 .tab-item, .pg-node-id-396, .pg-main-cs-4 { opacity: 0.4; } #main-wrapper .module9 .tab-box.on1 .tab-item:nth-child(2), .pg-node-id-397, .pg-main-cs-4 { opacity: 1; } #main-wrapper .module9 .tab-box.on2 .line, .pg-node-id-398, .pg-main-cs-4 { top: 3.38542vw; } #main-wrapper .module9 .tab-box.on2 .tab-item, .pg-node-id-399, .pg-main-cs-4 { opacity: 0.4; } #main-wrapper .module9 .tab-box.on2 .tab-item:nth-child(3), .pg-node-id-400, .pg-main-cs-4 { opacity: 1; } #main-wrapper .module9 .tab-box.on3 .line, .pg-node-id-401, .pg-main-cs-4 { top: 6.40625vw; } #main-wrapper .module9 .tab-box.on3 .tab-item, .pg-node-id-402, .pg-main-cs-4 { opacity: 0.4; } #main-wrapper .module9 .tab-box.on3 .tab-item:nth-child(4), .pg-node-id-403, .pg-main-cs-4 { opacity: 1; } #main-wrapper .module10, #main-wrapper .module11, .pg-node-id-404, .pg-main-cs-4 { display: none; } #main-wrapper .module12, .pg-node-id-405, .pg-main-cs-4 { display: none; } #main-wrapper .module12 .module-inner, .pg-node-id-406, .pg-main-cs-4 { height: 100%; padding-top: 0.05208vw; } #main-wrapper .module12 .introduce, .pg-node-id-407, .pg-main-cs-4 { position: absolute; top: 16.77083vw; right: 0; width: 27.08333vw; } #main-wrapper .module12 .set-box, .pg-node-id-408, .pg-main-cs-4 { position: relative; top: 16.14583vw; width: 49.01042vw; height: 23.95833vw; } #main-wrapper .module12 .set-box picture:nth-child(1), .pg-node-id-409, .pg-main-cs-4 { position: absolute; top: 0; left: 0; width: 23.95833vw; height: 11.45833vw; -webkit-transition: all 1s; transition: all 1s; } #main-wrapper .module12 .set-box picture:nth-child(2), .pg-node-id-410, .pg-main-cs-4 { position: absolute; bottom: 0; left: 0; width: 11.45833vw; height: 11.45833vw; -webkit-transition: all 1.5s; transition: all 1.5s; } #main-wrapper .module12 .set-box picture:nth-child(3), .pg-node-id-411, .pg-main-cs-4 { position: absolute; bottom: 0; left: 12.8125vw; width: 11.45833vw; height: 11.45833vw; -webkit-transition: all 1s; transition: all 1s; } #main-wrapper .module12 .set-box picture:nth-child(4), .pg-node-id-412, .pg-main-cs-4 { position: absolute; top: 0; left: 25.3125vw; width: 11.45833vw; height: 11.45833vw; -webkit-transition: all 1.5s; transition: all 1.5s; } #main-wrapper .module12 .set-box picture:nth-child(5), .pg-node-id-413, .pg-main-cs-4 { position: absolute; top: 12.5vw; left: 25.3125vw; width: 11.45833vw; height: 5.20833vw; -webkit-transition: all 1s; transition: all 1s; } #main-wrapper .module12 .set-box picture:nth-child(6), .pg-node-id-414, .pg-main-cs-4 { position: absolute; top: 12.5vw; left: 37.8125vw; width: 11.45833vw; height: 5.20833vw; -webkit-transition: all 1.5s; transition: all 1.5s; } #main-wrapper .module12 .set-box picture:nth-child(7), .pg-node-id-415, .pg-main-cs-4 { position: absolute; bottom: 0; left: 25.3125vw; width: 23.95833vw; -webkit-transition: all 1.5s; transition: all 1.5s; } #main-wrapper .module12 .set-box.on picture:nth-child(1), .pg-node-id-416, .pg-main-cs-4 { -webkit-transform: translate(-15.625vw, 0vw); transform: translate(-15.625vw, 0vw); } #main-wrapper .module12 .set-box.on picture:nth-child(2), .pg-node-id-417, .pg-main-cs-4 { -webkit-transform: translate(-15.625vw, 0vw); transform: translate(-15.625vw, 0vw); } #main-wrapper .module12 .set-box.on picture:nth-child(3), .pg-node-id-418, .pg-main-cs-4 { -webkit-transform: translate(-6.25vw, 0vw); transform: translate(-6.25vw, 0vw); } #main-wrapper .module12 .set-box.on picture:nth-child(4), .pg-node-id-419, .pg-main-cs-4 { -webkit-transform: translate(0vw, -7.8125vw); transform: translate(0vw, -7.8125vw); } #main-wrapper .module12 .set-box.on picture:nth-child(5), .pg-node-id-420, .pg-main-cs-4 { -webkit-transform: translate(6.25vw, 0vw); transform: translate(6.25vw, 0vw); } #main-wrapper .module12 .set-box.on picture:nth-child(6), .pg-node-id-421, .pg-main-cs-4 { -webkit-transform: translate(11.45833vw, 0vw); transform: translate(11.45833vw, 0vw); } #main-wrapper .module12 .set-box.on picture:nth-child(7), .pg-node-id-422, .pg-main-cs-4 { -webkit-transform: translate(15.625vw, 0vw); transform: translate(15.625vw, 0vw); } #main-wrapper .module13, .pg-node-id-423, .pg-main-cs-4 { height: 56.25vw; display: none; } #main-wrapper .module13 .module-inner, .pg-node-id-424, .pg-main-cs-4 { height: 100%; } #main-wrapper .module13 .introduce, .pg-node-id-425, .pg-main-cs-4 { position: absolute; top: 21.25vw; left: 0; width: 27.08333vw; } #main-wrapper .module13 .phone-box, .pg-node-id-426, .pg-main-cs-4 { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; position: absolute; top: 9.375vw; right: -6.40625vw; width: 38.80208vw; height: 38.02083vw; } #main-wrapper .module13 .phone-box picture, .pg-node-id-427, .pg-main-cs-4 { width: 12.5vw; height: 26.77083vw; } #main-wrapper .module13 .phone-box :nth-child(1), .pg-node-id-428, .pg-main-cs-4 { margin-top: 5.72917vw; } #main-wrapper .module13 .phone-box picture:nth-child(3), .pg-node-id-429, .pg-main-cs-4 { margin-top: 11.45833vw; } #main-wrapper .module14, .pg-node-id-430, .pg-main-cs-4 { position: relative; display: none; background-color: #000; } #main-wrapper .module14 .module-inner, .pg-node-id-431, .pg-main-cs-4 { height: 100%; } #main-wrapper .module15, .pg-node-id-432, .pg-main-cs-4 { height: 56.25vw; display: none; background-color: #000; } #main-wrapper .module15 .module-inner, .pg-node-id-433, .pg-main-cs-4 { height: 100%; } #main-wrapper .module15 .introduce, .pg-node-id-434, .pg-main-cs-4 { position: absolute; left: 0; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); width: 27.08333vw; z-index: 4; } #main-wrapper .module15 .neon-box, .pg-node-id-435, .pg-main-cs-4 { position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); width: 100vw; height: 56.25vw; } #main-wrapper .module15 .neon-box .neon-item, .pg-node-id-436, .pg-main-cs-4 { position: absolute; width: 12.5vw; height: 24.375vw; } #main-wrapper .module15 .neon-box .neon-item picture, .pg-node-id-437, .pg-main-cs-4 { position: absolute; top: 0; left: 0; } #main-wrapper .module15 .neon-box .neon-item:nth-child(1), .pg-node-id-438, .pg-main-cs-4 { top: 14.63542vw; left: 47.1875vw; } #main-wrapper .module15 .neon-box .neon-item:nth-child(2), .pg-node-id-439, .pg-main-cs-4 { top: 26.82292vw; left: 62.34375vw; } #main-wrapper .module15 .neon-box .neon-item:nth-child(3), .pg-node-id-440, .pg-main-cs-4 { top: -0.3vw; left: 32vw; } #main-wrapper .module15 .neon-box .neon-item:nth-child(4), .pg-node-id-441, .pg-main-cs-4 { top: 16.5625vw; left: 0; } #main-wrapper .module15 .neon-box .neon-item:nth-child(5), .pg-node-id-442, .pg-main-cs-4 { top: 31.875vw; left: 22.5vw; } #main-wrapper .module15 .neon-box .neon-item:nth-child(6), .pg-node-id-443, .pg-main-cs-4 { top: 34.42708vw; left: 79.94792vw; } #main-wrapper .module15 .neon-box .neon-item:nth-child(7), .pg-node-id-444, .pg-main-cs-4 { top: 3.75vw; left: 68.22917vw; } #main-wrapper .module15 .neon-box .neon-item:nth-child(8), .pg-node-id-445, .pg-main-cs-4 { top: 14.63542vw; left: 88.07292vw; } #main-wrapper .module16.india, .pg-node-id-446, .pg-main-cs-4 { height: 56.25vw; display: none; } #main-wrapper .module16.india .module-inner, .pg-node-id-447, .pg-main-cs-4 { height: 100%; } #main-wrapper .module16.india .sec3-bg, .pg-node-id-448, .pg-main-cs-4 { position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); width: 100vw; height: 56.25vw; } #main-wrapper .module16.india .sec3-bg #m4-video3, .pg-node-id-449, .pg-main-cs-4 { display: none; } #main-wrapper .module16.india .sec3-bg #m4-video1, .pg-node-id-450, .pg-main-cs-4 { width: 100%; } #main-wrapper .module16.india .sec3-bg #m4-video2, #main-wrapper .module16.india .sec3-bg #m4-video4, .pg-node-id-451, .pg-main-cs-4 { display: none; } #main-wrapper .module16.india .introduce, .pg-node-id-452, .pg-main-cs-4 { position: absolute; top: 9vw; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); width: 27.08333vw; z-index: 4; } #main-wrapper .module16.india .introduce .base-desc sup, .pg-node-id-453, .pg-main-cs-4 { font-size: 0.20833vw; } #main-wrapper .module16.india .phone, .pg-node-id-454, .pg-main-cs-4 { position: relative; top: 21.97917vw; width: 62.39583vw; height: 29.16667vw; margin: 0 auto; z-index: 2; } #main-wrapper .module16.india .phone .content, .pg-node-id-455, .pg-main-cs-4 { position: absolute; top: 0; left: 0; -webkit-transition: all 0.5s; transition: all 0.5s; } #main-wrapper .module16.india .phone .border, .pg-node-id-456, .pg-main-cs-4 { position: absolute; top: 0; left: 0; } #main-wrapper .module16.india .phone.on1 .content1, .pg-node-id-457, .pg-main-cs-4 { opacity: 1; } #main-wrapper .module16.india .phone.on1 .content2, .pg-node-id-458, .pg-main-cs-4 { opacity: 0; } #main-wrapper .module16.india .phone.on1 .content3, .pg-node-id-459, .pg-main-cs-4 { opacity: 0; } #main-wrapper .module16.india .phone.on2 .content1, .pg-node-id-460, .pg-main-cs-4 { opacity: 0; } #main-wrapper .module16.india .phone.on2 .content2, .pg-node-id-461, .pg-main-cs-4 { opacity: 1; } #main-wrapper .module16.india .phone.on2 .content3, .pg-node-id-462, .pg-main-cs-4 { opacity: 0; } #main-wrapper .module16.india .phone.on3 .content1, .pg-node-id-463, .pg-main-cs-4 { opacity: 0; } #main-wrapper .module16.india .phone.on3 .content2, .pg-node-id-464, .pg-main-cs-4 { opacity: 0; } #main-wrapper .module16.india .phone.on3 .content3, .pg-node-id-465, .pg-main-cs-4 { opacity: 1; } #main-wrapper .module16.global, .pg-node-id-466, .pg-main-cs-4 { height: 56.25vw; display: none; } #main-wrapper .module16.global .module-inner, .pg-node-id-467, .pg-main-cs-4 { height: 100%; } #main-wrapper .module16.global .sec3-bg, .pg-node-id-468, .pg-main-cs-4 { position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); width: 100vw; height: 56.25vw; } #main-wrapper .module16.global .sec3-bg #m4-video1, .pg-node-id-469, .pg-main-cs-4 { display: none; } #main-wrapper .module16.global .sec3-bg #m4-video3, .pg-node-id-470, .pg-main-cs-4 { width: 100%; } #main-wrapper .module16.global .sec3-bg #m4-video2, #main-wrapper .module16.global .sec3-bg #m4-video4, .pg-node-id-471, .pg-main-cs-4 { display: none; } #main-wrapper .module16.global .introduce, .pg-node-id-472, .pg-main-cs-4 { position: absolute; top: 9vw; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); width: 27.08333vw; z-index: 4; } #main-wrapper .module16.global .introduce .base-desc sup, .pg-node-id-473, .pg-main-cs-4 { font-size: 0.20833vw; } #main-wrapper .module16.global .phone, .pg-node-id-474, .pg-main-cs-4 { position: relative; top: 21.97917vw; width: 62.39583vw; height: 29.16667vw; margin: 0 auto; z-index: 2; } #main-wrapper .module16.global .phone .content, .pg-node-id-475, .pg-main-cs-4 { position: absolute; top: 0; left: 0; -webkit-transition: all 0.5s; transition: all 0.5s; } #main-wrapper .module16.global .phone .border, .pg-node-id-476, .pg-main-cs-4 { position: absolute; top: 0; left: 0; } #main-wrapper .module16.global .phone.on1 .content1, .pg-node-id-477, .pg-main-cs-4 { opacity: 1; } #main-wrapper .module16.global .phone.on1 .content2, .pg-node-id-478, .pg-main-cs-4 { opacity: 0; } #main-wrapper .module16.global .phone.on1 .content3, .pg-node-id-479, .pg-main-cs-4 { opacity: 0; } #main-wrapper .module16.global .phone.on2 .content1, .pg-node-id-480, .pg-main-cs-4 { opacity: 0; } #main-wrapper .module16.global .phone.on2 .content2, .pg-node-id-481, .pg-main-cs-4 { opacity: 1; } #main-wrapper .module16.global .phone.on2 .content3, .pg-node-id-482, .pg-main-cs-4 { opacity: 0; } #main-wrapper .module16.global .phone.on3 .content1, .pg-node-id-483, .pg-main-cs-4 { opacity: 0; } #main-wrapper .module16.global .phone.on3 .content2, .pg-node-id-484, .pg-main-cs-4 { opacity: 0; } #main-wrapper .module16.global .phone.on3 .content3, .pg-node-id-485, .pg-main-cs-4 { opacity: 1; } #main-wrapper .module17, #main-wrapper .module18, .pg-node-id-486, .pg-main-cs-4 { display: none; } #main-wrapper .module19, .pg-node-id-487, .pg-main-cs-4 { height: 56.25vw; display: none; } #main-wrapper .module19 .module-inner, .pg-node-id-488, .pg-main-cs-4 { height: 100%; padding-top: 0.05208vw; } #main-wrapper .module19 .introduce, .pg-node-id-489, .pg-main-cs-4 { width: 27.08333vw; margin-top: 7.29167vw; margin-left: 6.77083vw; } #main-wrapper .module19 .wallpaper-box, .pg-node-id-490, .pg-main-cs-4 { position: relative; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; width: 53.125vw; height: 26.77083vw; margin-top: 4.16667vw; margin-left: 6.77083vw; -webkit-transform: scale(1.8) translateY(-3.02083vw); transform: scale(1.8) translateY(-3.02083vw); overflow: hidden; } #main-wrapper .module19 .wallpaper-box.complete, .pg-node-id-491, .pg-main-cs-4 { -webkit-transform: none; transform: none; -webkit-transition: -webkit-transform 1.2s; transition: -webkit-transform 1.2s; transition: transform 1.2s; transition: transform 1.2s, -webkit-transform 1.2s; } #main-wrapper .module19 .wallpaper-list, .pg-node-id-492, .pg-main-cs-4 { margin-top: -0.52083vw; -webkit-transform: translateY(calc(-7.68 * 28.33333vw)); transform: translateY(calc(-7.68 * 28.33333vw)); } #main-wrapper .module19 .wallpaper-box.start .wallpaper-list-one, .pg-node-id-493, .pg-main-cs-4 { -webkit-animation: picScroll 5.5s forwards; animation: picScroll 5.5s forwards; } #main-wrapper .module19 .wallpaper-box.start .wallpaper-list-two, .pg-node-id-494, .pg-main-cs-4 { -webkit-animation: picScroll 5.5s 0.4s forwards; animation: picScroll 5.5s 0.4s forwards; } #main-wrapper .module19 .wallpaper-box.start .wallpaper-list-three, .pg-node-id-495, .pg-main-cs-4 { -webkit-animation: picScroll 5.5s 0.7s forwards; animation: picScroll 5.5s 0.7s forwards; } #main-wrapper .module19 .wallpaper-box.start .wallpaper-list-four, .pg-node-id-496, .pg-main-cs-4 { -webkit-animation: picScroll 5.5s 1s forwards; animation: picScroll 5.5s 1s forwards; } #main-wrapper .module19 .wallpaper-item, .pg-node-id-497, .pg-main-cs-4 { width: 12.76042vw; } @-webkit-keyframes picScroll { 0% { -webkit-transform: translateY(calc(-7.68 * 28.33333vw)); transform: translateY(calc(-7.68 * 28.33333vw)); } 100% { -webkit-transform: translateY(0); transform: translateY(0); } } @keyframes picScroll { 0% { -webkit-transform: translateY(calc(-7.68 * 28.33333vw)); transform: translateY(calc(-7.68 * 28.33333vw)); } 100% { -webkit-transform: translateY(0); transform: translateY(0); } } #main-wrapper .module20, .pg-node-id-498, .pg-main-cs-4 { height: 56.25vw; display: none; } #main-wrapper .module20 .module-inner, .pg-node-id-499, .pg-main-cs-4 { height: 100%; } #main-wrapper .module20 .introduce, .pg-node-id-500, .pg-main-cs-4 { position: absolute; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); right: 1.04167vw; width: 28.90625vw; } #main-wrapper .module20 .introduce .base-desc, .pg-node-id-501, .pg-main-cs-4 { width: 27.08333vw; } #main-wrapper .module20 .phone, .pg-node-id-502, .pg-main-cs-4 { position: absolute; top: 12.08333vw; left: 6.77083vw; width: 16.66667vw; height: 35.625vw; } #main-wrapper .module20 .watch, .pg-node-id-503, .pg-main-cs-4 { position: absolute; top: 34.0625vw; left: 19.84375vw; width: 9.375vw; height: 13.90625vw; } #main-wrapper .module21, .pg-node-id-504, .pg-main-cs-4 { width: 100vw; position: relative; height: 56.25vw; display: none; left: 0; -webkit-transform: translate(0, -50%); transform: translate(0, -50%); } #main-wrapper .module21 .module-inner, .pg-node-id-505, .pg-main-cs-4 { height: 100%; } #main-wrapper .module21 .module21-canvas, .pg-node-id-506, .pg-main-cs-4 { width: 100%; } #main-wrapper .module22, .pg-node-id-507, .pg-main-cs-4 { width: 100vw; height: 56.25vw; display: none; left: 0; -webkit-transform: translate(0, -50%); transform: translate(0, -50%); } #main-wrapper .module22 .module-inner, .pg-node-id-508, .pg-main-cs-4 { height: 100%; width: 67.1875vw; } #main-wrapper .module22 .introduce, .pg-node-id-509, .pg-main-cs-4 { position: absolute; top: 23.75vw; right: 0; width: 27.08333vw; } #main-wrapper .module22 .grident-line, .pg-node-id-510, .pg-main-cs-4 { position: absolute; top: 13.22917vw; right: 2.91667vw; width: 79.89583vw; height: 21.14583vw; -webkit-clip-path: inset(0 0 0 29.7%); clip-path: inset(0 0 0 29.7%); } #main-wrapper .module22 .grident-line-mobile, .pg-node-id-511, .pg-main-cs-4 { display: none; position: absolute; top: 13.22917vw; right: 2.91667vw; width: 79.89583vw; height: 21.14583vw; -webkit-clip-path: inset(0 0 0 29.7%); clip-path: inset(0 0 0 29.7%); } #main-wrapper .module22 .ball-path, .pg-node-id-512, .pg-main-cs-4 { position: absolute; top: 13.22917vw; right: 3.38542vw; width: 79.32292vw; height: 21.14583vw; } #main-wrapper .module22 .ball-path > svg:nth-child(2), .pg-node-id-513, .pg-main-cs-4 { display: none; } #main-wrapper .module22 .ball, .pg-node-id-514, .pg-main-cs-4 { width: 1.66667vw; height: 1.66667vw; } #main-wrapper .module23, .pg-node-id-515, .pg-main-cs-4 { width: 100vw; top: 0; left: 0%; -webkit-transform: translate(0%, 0%); transform: translate(0%, 0%); display: none; overflow-x: hidden; overflow-y: hidden; } #main-wrapper .module23 .module-inner, .pg-node-id-516, .pg-main-cs-4 { height: 100%; } #main-wrapper .module23 .module-bg, .pg-node-id-517, .pg-main-cs-4 { position: absolute; top: 0; width: 100vw; } #main-wrapper .module23 .scroll-box, .pg-node-id-518, .pg-main-cs-4 { position: relative; width: 100vw; height: 100vh; overflow-x: hidden; } #main-wrapper .module23 .scroll-box > .module-inner, .pg-node-id-519, .pg-main-cs-4 { height: 56.25vw; } #main-wrapper .module23 .scroll-box footer, .pg-node-id-520, .pg-main-cs-4 { display: block; } #main-wrapper .module23 .module-bg, .pg-node-id-521, .pg-main-cs-4 { width: 100vw; } #main-wrapper .module23 .module19-introduce, .pg-node-id-522, .pg-main-cs-4 { position: absolute; top: 23.75vw; left: 0; width: 27.08333vw; } #main-wrapper .module23 .module19-introduce sup, .pg-node-id-523, .pg-main-cs-4 { font-size: 1.82292vw; margin: 0 0 0 -0.78125vw; } #main-wrapper .module23 .phone, .pg-node-id-524, .pg-main-cs-4 { position: absolute; top: 8.59375vw; right: 0; width: 29.16667vw; height: 47.91667vw; } #main-wrapper .module24, .pg-node-id-525, .pg-main-cs-4 { position: relative !important; top: 0; left: 0; -webkit-transform: none; transform: none; width: 100vw; height: 22.08333vw; background-color: #202125; } #main-wrapper .module24 .module-inner, .pg-node-id-526, .pg-main-cs-4 { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -webkit-flex-flow: row nowrap; -ms-flex-flow: row nowrap; flex-flow: row nowrap; height: 22.08333vw; padding: 0 10.41667vw; } #main-wrapper .module24 .icon, .pg-node-id-527, .pg-main-cs-4 { width: 14.58333vw; height: 14.58333vw; } #main-wrapper .module24 .module20-introduce, .pg-node-id-528, .pg-main-cs-4 { width: 21.875vw; } #main-wrapper .module24 .module20-introduce .base-title, .pg-node-id-529, .pg-main-cs-4 { font-size: 2.08333vw; line-height: 2.5vw; } #main-wrapper .module24 .module20-introduce .base-desc, .pg-node-id-530, .pg-main-cs-4 { margin-top: 2.08333vw; font-size: 0.9375vw; line-height: 1.14583vw; } #main-wrapper .module24 .module20-introduce .base-desc sup, .pg-node-id-531, .pg-main-cs-4 { font-size: 0.41667vw; } #main-wrapper .module25, .pg-node-id-532, .pg-main-cs-4 { position: relative !important; top: 0; left: 0; -webkit-transform: none; transform: none; width: 100vw; height: 12.5vw; background-color: #fff; } #main-wrapper .module25 .module-inner, .pg-node-id-533, .pg-main-cs-4 { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -webkit-flex-flow: row wrap; -ms-flex-flow: row wrap; flex-flow: row wrap; padding: 2.08333vw 0; width: 64.58333vw; } #main-wrapper .module25 .title, .pg-node-id-534, .pg-main-cs-4 { width: 100%; font-size: 0.9375vw; line-height: 1.14583vw; color: #828282; margin-bottom: 1.04167vw; } #main-wrapper .module25 .desc, .pg-node-id-535, .pg-main-cs-4 { width: 100%; -webkit-transform: scale(0.9) translateX(-3.64583vw); transform: scale(0.9) translateX(-3.64583vw); font-size: 0.625vw; line-height: 0.72917vw; color: #828282; margin-bottom: 1.04167vw; white-space: nowrap; } } @media screen and (min-width: 1024px) and (max-width: 1599px) { #main-wrapper .module23, .pg-node-id-536, .pg-main-cs-4 { top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } } @media screen and (min-width: 500px) and (max-width: 1023px) { #main-wrapper .module-inner, .pg-node-id-537, .pg-main-cs-4 { -webkit-transform: scale(0.7); transform: scale(0.7); } } @media screen and (max-width: 1023px) { #main-wrapper .main-box, .pg-node-id-538, .pg-main-cs-4 { position: fixed; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); width: 100%; height: 100%; } #main-wrapper .swiper-container, .pg-node-id-539, .pg-main-cs-4 { height: 100%; pointer-events: auto; } #main-wrapper .swiper-container .swiper-slide, .pg-node-id-540, .pg-main-cs-4 { height: 100%; } #main-wrapper .swiper-container .swiper-slide .module-inner, .pg-node-id-541, .pg-main-cs-4 { position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); height: 188.88889vw; } #main-wrapper .swiper-container .swiper-slide .introduce, .pg-node-id-542, .pg-main-cs-4 { position: absolute; bottom: 81.94444vw; left: 0; } #main-wrapper .swiper-container .swiper-slide .btn-video-box, .pg-node-id-543, .pg-main-cs-4 { opacity: 1 !important; height: 13.33333vw; margin-top: 5.55556vw; font-size: 6.66667vw; line-height: 13.33333vw; } #main-wrapper .swiper-container .swiper-slide .btn-video-box .play-icon, .pg-node-id-544, .pg-main-cs-4 { width: 13.33333vw; height: 13.33333vw; margin-left: 5.55556vw; display: inline-block; vertical-align: middle; } } @media screen and (max-width: 1023px) and (min-aspect-ratio: 5 / 9) and (max-aspect-ratio: 7 / 9) { #main-wrapper .swiper-container .swiper-slide, .pg-node-id-545, .pg-main-cs-4 { position: relative; } #main-wrapper .swiper-container .swiper-slide .module-inner, .pg-node-id-546, .pg-main-cs-4 { position: absolute !important; height: 188.88889vw !important; left: 50% !important; top: 50% !important; -webkit-transform: translate(-50%, -50%) scale(0.87) !important; transform: translate(-50%, -50%) scale(0.87) !important; } #main-wrapper .swiper-container .swiper-slide .introduce, .pg-node-id-547, .pg-main-cs-4 { position: absolute; bottom: 81.94444vw; left: 0; } #main-wrapper .swiper-container .swiper-slide .btn-video-box, .pg-node-id-548, .pg-main-cs-4 { position: relative; opacity: 1 !important; height: 13.33333vw; margin-top: 5.55556vw; font-size: 6.66667vw; line-height: 13.33333vw; } #main-wrapper .swiper-container .swiper-slide .btn-video-box .play-icon, .pg-node-id-549, .pg-main-cs-4 { position: absolute; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); width: 13.33333vw; height: 61.11111vw; margin-left: 5.55556vw; display: inline-block; vertical-align: middle; } #main-wrapper .swiper-container .swiper-slide .btn-video-box .play-icon picture, .pg-node-id-550, .pg-main-cs-4 { position: absolute; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); width: 13.33333vw; height: 13.33333vw; } } @media screen and (max-width: 1023px) { #main-wrapper .module, .pg-node-id-551, .pg-main-cs-4 { display: none; position: fixed !important; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); height: 100%; } #main-wrapper .module-kv, .pg-node-id-552, .pg-main-cs-4 { display: block; background: #000; height: 188.88889vw; } #main-wrapper .module-kv .module-inner, .pg-node-id-553, .pg-main-cs-4 { height: 188.88889vw; } #main-wrapper .module-kv .module-bg, .pg-node-id-554, .pg-main-cs-4 { width: 100vw; height: 100%; opacity: 0; -webkit-transform: scale(0.5); transform: scale(0.5); -webkit-transition: all 1.5s; transition: all 1.5s; z-index: 1; z-index: 1; } #main-wrapper .module-kv .module-bg .kv-circle-box, .pg-node-id-555, .pg-main-cs-4 { position: absolute; top: 12.5vw; left: 50%; -webkit-transform: translate(-50%, 0); transform: translate(-50%, 0); width: 100vw; height: 135.41667vw; z-index: 2; } #main-wrapper .module-kv .module-bg .kv-circle-box .kv-circle, .pg-node-id-556, .pg-main-cs-4 { position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); width: 100%; height: 100%; opacity: 0; -webkit-transform-origin: center center; transform-origin: center center; } #main-wrapper .module-kv .module-bg .kv-ding, .pg-node-id-557, .pg-main-cs-4 { position: absolute; top: -2.77778vw; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); width: 100vw; height: 136.11111vw; opacity: 0; } #main-wrapper .module-kv .module-bg .kv-bottom, .pg-node-id-558, .pg-main-cs-4 { position: absolute; bottom: 0; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); width: 100vw; height: 60.69444vw; z-index: 3; opacity: 0; } #main-wrapper .module-kv .module-bg.on, .pg-node-id-559, .pg-main-cs-4 { opacity: 1; -webkit-transform: scale(1); transform: scale(1); -webkit-transition: opacity 3s, -webkit-transform 1.1s; transition: opacity 3s, -webkit-transform 1.1s; transition: transform 1.1s, opacity 3s; transition: transform 1.1s, opacity 3s, -webkit-transform 1.1s; } #main-wrapper .module-kv .module-bg.on .kv-circle, .pg-node-id-560, .pg-main-cs-4 { opacity: 1; -webkit-transition: all 1.2s; transition: all 1.2s; } #main-wrapper .module-kv .module-bg.on .kv-bottom, .pg-node-id-561, .pg-main-cs-4 { opacity: 1; -webkit-transition: all 1.2s 1.2s; transition: all 1.2s 1.2s; } #main-wrapper .module-kv .module-bg.on .kv-ding, .pg-node-id-562, .pg-main-cs-4 { opacity: 1; -webkit-transition: all 1.2s 1.2s; transition: all 1.2s 1.2s; } #main-wrapper .module-kv .module-bg.cut, .pg-node-id-563, .pg-main-cs-4 { -webkit-transform: scale(3.3); transform: scale(3.3); -webkit-transition: opacity 1.4s, -webkit-transform 1.2s; transition: opacity 1.4s, -webkit-transform 1.2s; transition: opacity 1.4s, transform 1.2s; transition: opacity 1.4s, transform 1.2s, -webkit-transform 1.2s; } #main-wrapper .module-kv .module-bg.cut .kv-circle, .pg-node-id-564, .pg-main-cs-4 { -webkit-transform: translate(-50%, -50%) scale(3.3); transform: translate(-50%, -50%) scale(3.3); -webkit-transition: opacity 1.4s, -webkit-transform 1.2s; transition: opacity 1.4s, -webkit-transform 1.2s; transition: opacity 1.4s, transform 1.2s; transition: opacity 1.4s, transform 1.2s, -webkit-transform 1.2s; } #main-wrapper .module-kv .module-bg.cut .kv-bottom, .pg-node-id-565, .pg-main-cs-4 { opacity: 0; -webkit-transition: all 0s 0s; transition: all 0s 0s; } #main-wrapper .module-kv .module-bg.cut .kv-ding, .pg-node-id-566, .pg-main-cs-4 { opacity: 0; -webkit-transition: all 0s 0s; transition: all 0s 0s; } #main-wrapper .module-kv .module-inner, .pg-node-id-567, .pg-main-cs-4 { height: 188.88889vw; z-index: 2; } #main-wrapper .module-kv .module-inner .introduce-kv, .pg-node-id-568, .pg-main-cs-4 { position: absolute; left: 0; top: 65.27778vw; width: 88.88889vw; color: #fff; z-index: 4; } #main-wrapper .module-kv .module-inner .introduce-kv .kv-type, .pg-node-id-569, .pg-main-cs-4 { opacity: 0; font-size: 4.72222vw; line-height: 5.27778vw; -webkit-transform: translateY(13.88889vw); transform: translateY(13.88889vw); } #main-wrapper .module-kv .module-inner .introduce-kv .kv-title, .pg-node-id-570, .pg-main-cs-4 { opacity: 0; margin-top: 1.38889vw; font-size: 9.16667vw; line-height: 11.11111vw; -webkit-transform: translateY(20.83333vw); transform: translateY(20.83333vw); } #main-wrapper .module-kv .module-inner .introduce-kv .kv-desc, .pg-node-id-571, .pg-main-cs-4 { opacity: 0; margin-top: 11.11111vw; font-size: 4.44444vw; line-height: 5.27778vw; color: #D9D9D6; -webkit-transform: translateY(13.88889vw); transform: translateY(13.88889vw); } #main-wrapper .module-kv .module-inner.on .kv-type, .pg-node-id-572, .pg-main-cs-4 { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0); -webkit-transition: all 1.5s; transition: all 1.5s; } #main-wrapper .module-kv .module-inner.on .kv-title, .pg-node-id-573, .pg-main-cs-4 { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0); -webkit-transition: all 1.5s; transition: all 1.5s; } #main-wrapper .module-kv .module-inner.on .kv-desc, .pg-node-id-574, .pg-main-cs-4 { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0); -webkit-transition: all 1.5s; transition: all 1.5s; } #main-wrapper .module-kv .module-inner.cut .kv-type, .pg-node-id-575, .pg-main-cs-4 { opacity: 1; -webkit-transform: translateY(-16.66667vw); transform: translateY(-16.66667vw); -webkit-transition: all 1.2s; transition: all 1.2s; } #main-wrapper .module-kv .module-inner.cut .kv-title, .pg-node-id-576, .pg-main-cs-4 { opacity: 1; -webkit-transform: translateY(-27.77778vw); transform: translateY(-27.77778vw); -webkit-transition: all 1.2s; transition: all 1.2s; } #main-wrapper .module-kv .module-inner.cut .kv-desc, .pg-node-id-577, .pg-main-cs-4 { opacity: 1; -webkit-transform: translateY(-16.66667vw); transform: translateY(-16.66667vw); -webkit-transition: all 1.2s; transition: all 1.2s; } #main-wrapper .module1, .pg-node-id-578, .pg-main-cs-4 { display: none; position: relative; width: 100%; height: 188.88889vw; } #main-wrapper .module1 .module-inner, .pg-node-id-579, .pg-main-cs-4 { height: 100%; } #main-wrapper .module1 .module-bg, .pg-node-id-580, .pg-main-cs-4 { display: none !important; } #main-wrapper .module1 .module-bg2, .pg-node-id-581, .pg-main-cs-4 { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; margin: -37.5vw 0 0 -2.77778vw; width: 105.55556vw; height: 248.88889vw; -webkit-transition: -webkit-transform 1.5s; transition: -webkit-transform 1.5s; transition: transform 1.5s; transition: transform 1.5s, -webkit-transform 1.5s; } #main-wrapper .module1 .module-bg2 .column-bg, .pg-node-id-582, .pg-main-cs-4 { width: 33.33333vw; height: 100%; -webkit-perspective: 194.44444vw; perspective: 194.44444vw; } #main-wrapper .module1 .module-bg2 .column-bg picture, .pg-node-id-583, .pg-main-cs-4 { opacity: 1; height: 71.38889vw; width: 33.33333vw; margin-bottom: 5.55556vw; -webkit-transition: all 1s 0.2s; transition: all 1s 0.2s; } #main-wrapper .module1 .module-bg2 .column-bg picture:last-child, .pg-node-id-584, .pg-main-cs-4 { margin-bottom: 0; } #main-wrapper .module1 .module-bg2 .column-bg1, #main-wrapper .module1 .module-bg2 .column-bg3, .pg-node-id-585, .pg-main-cs-4 { margin-top: 26.38889vw; } #main-wrapper .module1 .module-bg2.on, .pg-node-id-586, .pg-main-cs-4 { opacity: 1; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; width: 136.11111vw; height: 311.11111vw; } #main-wrapper .module1 .module-bg2.on .column-bg picture, .pg-node-id-587, .pg-main-cs-4 { width: 41.66667vw; height: 89.16667vw; margin-bottom: 5.55556vw; -webkit-transition: all 0.5s 0s; transition: all 0.5s 0s; } #main-wrapper .module1 .module-bg2.on .column-bg:nth-child(1) picture:nth-child(1), .pg-node-id-588, .pg-main-cs-4 { opacity: 0.3; -webkit-transform: translate3d(-41.66667vw, -41.66667vw, -111.11111vw); transform: translate3d(-41.66667vw, -41.66667vw, -111.11111vw); } #main-wrapper .module1 .module-bg2.on .column-bg:nth-child(1) picture:nth-child(2), .pg-node-id-589, .pg-main-cs-4 { opacity: 0.7; -webkit-transform: translate3d(-41.66667vw, 0vw, -27.77778vw); transform: translate3d(-41.66667vw, 0vw, -27.77778vw); } #main-wrapper .module1 .module-bg2.on .column-bg:nth-child(1) picture:nth-child(3), .pg-node-id-590, .pg-main-cs-4 { opacity: 0.5; -webkit-transform: translate3d(-13.88889vw, 13.88889vw, -5.55556vw); transform: translate3d(-13.88889vw, 13.88889vw, -5.55556vw); } #main-wrapper .module1 .module-bg2.on .column-bg:nth-child(2) picture:nth-child(1), .pg-node-id-591, .pg-main-cs-4 { opacity: 0.65; -webkit-transform: translate3d(13.88889vw, 13.88889vw, -13.88889vw); transform: translate3d(13.88889vw, 13.88889vw, -13.88889vw); } #main-wrapper .module1 .module-bg2.on .column-bg:nth-child(2) picture:nth-child(2), .pg-node-id-592, .pg-main-cs-4 { opacity: 0.35; -webkit-transform: translate3d(-41.66667vw, 25vw, -80.55556vw); transform: translate3d(-41.66667vw, 25vw, -80.55556vw); } #main-wrapper .module1 .module-bg2.on .column-bg:nth-child(2) picture:nth-child(3), .pg-node-id-593, .pg-main-cs-4 { opacity: 0.55; -webkit-transform: translate3d(19.44444vw, 0vw, -25vw); transform: translate3d(19.44444vw, 0vw, -25vw); } #main-wrapper .module1 .module-bg2.on .column-bg:nth-child(3) picture:nth-child(1), .pg-node-id-594, .pg-main-cs-4 { opacity: 0.4; -webkit-transform: translate3d(55.55556vw, -13.88889vw, -55.55556vw); transform: translate3d(55.55556vw, -13.88889vw, -55.55556vw); } #main-wrapper .module1 .module-bg2.on .column-bg:nth-child(3) picture:nth-child(2), .pg-node-id-595, .pg-main-cs-4 { opacity: 0.6; -webkit-transform: translate3d(27.77778vw, 0vw, -111.11111vw); transform: translate3d(27.77778vw, 0vw, -111.11111vw); } #main-wrapper .module1 .module-bg2.on .column-bg:nth-child(3) picture:nth-child(3), .pg-node-id-596, .pg-main-cs-4 { opacity: 0.55; -webkit-transform: translate3d(27.77778vw, 19.44444vw, -27.77778vw); transform: translate3d(27.77778vw, 19.44444vw, -27.77778vw); } #main-wrapper .module1 .module-bg2.small, .pg-node-id-597, .pg-main-cs-4 { -webkit-transform: scale(0.2); transform: scale(0.2); } #main-wrapper .module1 .module-bg.open .column-bg2, .pg-node-id-598, .pg-main-cs-4 { -webkit-transform: translateY(48.61111vw); transform: translateY(48.61111vw); -webkit-transition: -webkit-transform 1s; transition: -webkit-transform 1s; transition: transform 1s; transition: transform 1s, -webkit-transform 1s; } #main-wrapper .module1 .module-bg.open .column-bg3, .pg-node-id-599, .pg-main-cs-4 { -webkit-transform: translateY(250vw); transform: translateY(250vw); -webkit-transition: -webkit-transform 1s; transition: -webkit-transform 1s; transition: transform 1s; transition: transform 1s, -webkit-transform 1s; } #main-wrapper .module1 .module-bg.open .column-bg4 picture:nth-child(1), .pg-node-id-600, .pg-main-cs-4 { -webkit-transform: translateY(-252.77778vw); transform: translateY(-252.77778vw); -webkit-transition: -webkit-transform 1s; transition: -webkit-transform 1s; transition: transform 1s; transition: transform 1s, -webkit-transform 1s; } #main-wrapper .module1 .module-bg.open .column-bg4 picture:nth-child(2), .pg-node-id-601, .pg-main-cs-4 { -webkit-transform: translateY(-252.77778vw); transform: translateY(-252.77778vw); -webkit-transition: -webkit-transform 1s; transition: -webkit-transform 1s; transition: transform 1s; transition: transform 1s, -webkit-transform 1s; } #main-wrapper .module1 .module-bg.open .column-bg5 picture:nth-child(1), .pg-node-id-602, .pg-main-cs-4 { -webkit-transform: translateY(43.05556vw); transform: translateY(43.05556vw); -webkit-transition: -webkit-transform 1s; transition: -webkit-transform 1s; transition: transform 1s; transition: transform 1s, -webkit-transform 1s; } #main-wrapper .module1 .module-bg.open .column-bg5 picture:nth-child(2), .pg-node-id-603, .pg-main-cs-4 { -webkit-transform: translateY(43.05556vw); transform: translateY(43.05556vw); -webkit-transition: -webkit-transform 1s; transition: -webkit-transform 1s; transition: transform 1s; transition: transform 1s, -webkit-transform 1s; } #main-wrapper .module1 .module-bg2.open picture, .pg-node-id-604, .pg-main-cs-4 { -webkit-transition: all 1s; transition: all 1s; } #main-wrapper .module1 .module-bg2.open .column-bg1 picture:nth-child(1), #main-wrapper .module1 .module-bg2.open .column-bg1 picture:nth-child(2), .pg-node-id-605, .pg-main-cs-4 { -webkit-transform: translateY(-27.77778vw); transform: translateY(-27.77778vw); opacity: 0; } #main-wrapper .module1 .module-bg2.open .column-bg2 picture:nth-child(1), #main-wrapper .module1 .module-bg2.open .column-bg2 picture:nth-child(2), .pg-node-id-606, .pg-main-cs-4 { -webkit-transform: translateY(-27.77778vw); transform: translateY(-27.77778vw); opacity: 0; } #main-wrapper .module1 .module-bg2.open .column-bg3 picture:nth-child(1), #main-wrapper .module1 .module-bg2.open .column-bg3 picture:nth-child(2), .pg-node-id-607, .pg-main-cs-4 { -webkit-transform: translateY(-27.77778vw); transform: translateY(-27.77778vw); opacity: 0; } #main-wrapper .module1 .introduce, .pg-node-id-608, .pg-main-cs-4 { position: absolute; bottom: 81.94444vw; left: 0; } #main-wrapper .module1 .introduce.on .base-title, .pg-node-id-609, .pg-main-cs-4 { opacity: 0; } #main-wrapper .module1 .introduce.on .base-desc, .pg-node-id-610, .pg-main-cs-4 { opacity: 0; } #main-wrapper .module1 .btn-video-box, .pg-node-id-611, .pg-main-cs-4 { opacity: 0; height: 13.33333vw; margin-top: 5.55556vw; margin-left: 0vw; font-size: 6.66667vw; line-height: 13.33333vw; } #main-wrapper .module1 .btn-video-box .play-icon, .pg-node-id-612, .pg-main-cs-4 { width: 13.33333vw; height: 13.33333vw; margin-left: 5.55556vw; display: inline-block; vertical-align: middle; } #main-wrapper .module2, .pg-node-id-613, .pg-main-cs-4 { display: none; height: 188.88889vw; } #main-wrapper .module2 .module-bg, .pg-node-id-614, .pg-main-cs-4 { position: relative; width: 100%; height: 100%; -webkit-transform-origin: left bottom; transform-origin: left bottom; } #main-wrapper .module2 .module-bg .wall, .pg-node-id-615, .pg-main-cs-4 { position: absolute; top: 51.66667vw; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); width: 75vw; height: 104.16667vw; } #main-wrapper .module2 .module-bg .floor1, .pg-node-id-616, .pg-main-cs-4 { position: absolute; bottom: 0; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); width: 100vw; height: 39.72222vw; } #main-wrapper .module2 .module-bg .floor2, .pg-node-id-617, .pg-main-cs-4 { position: absolute; bottom: 0; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); width: 100vw; height: 95.27778vw; -webkit-filter: saturate(300%); filter: saturate(300%); } #main-wrapper .module2 .module-bg .bg-shadow, .pg-node-id-618, .pg-main-cs-4 { position: absolute; bottom: 0; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); width: 100vw; height: 35.27778vw; } #main-wrapper .module2 .module-bg.on, .pg-node-id-619, .pg-main-cs-4 { position: relative; width: 100%; height: 188.88889vw; -webkit-transform-origin: left bottom; transform-origin: left bottom; } #main-wrapper .module2 .module-inner, .pg-node-id-620, .pg-main-cs-4 { height: 188.88889vw; } #main-wrapper .module2 .module-title > div, .pg-node-id-621, .pg-main-cs-4 { opacity: 0; } #main-wrapper .module3, .pg-node-id-622, .pg-main-cs-4 { display: none; position: relative; width: 100%; height: 188.88889vw; } #main-wrapper .module3 .module-inner, .pg-node-id-623, .pg-main-cs-4 { position: relative; height: 188.88889vw; } #main-wrapper .module3 .introduce, .pg-node-id-624, .pg-main-cs-4 { position: absolute; width: 88.88889vw; left: 0; bottom: 108.33333vw; z-index: 4; } #main-wrapper .module3 .cartoon-box, .pg-node-id-625, .pg-main-cs-4 { position: absolute; top: 91.94444vw; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); width: 100vw; height: 83.05556vw; } #main-wrapper .module3 .cartoon-box .cartoon-text, .pg-node-id-626, .pg-main-cs-4 { position: absolute; bottom: -8.33333vw; width: 100%; font-size: 3.88889vw; line-height: 4.72222vw; color: #fff; text-align: center; z-index: 4; } #main-wrapper .module3 .cartoon-box .black3, .pg-node-id-627, .pg-main-cs-4 { position: absolute; top: 0; right: 0; width: 39.72222vw; height: 40.55556vw; } #main-wrapper .module3 .cartoon-box .desk, .pg-node-id-628, .pg-main-cs-4 { position: absolute; bottom: 0; right: 25vw; width: 18.88889vw; height: 37.91667vw; } #main-wrapper .module3 .cartoon-box .black4, .pg-node-id-629, .pg-main-cs-4 { position: absolute; top: 66.66667vw; left: 18.88889vw; width: 18.05556vw; height: 5.13889vw; } #main-wrapper .module3 .cartoon-box .black2, .pg-node-id-630, .pg-main-cs-4 { position: absolute; top: 65vw; right: 6.38889vw; width: 18.05556vw; height: 4.58333vw; } #main-wrapper .module3 .cartoon-box .black1, .pg-node-id-631, .pg-main-cs-4 { position: absolute; top: 58.05556vw; right: 0vw; width: 18.05556vw; height: 4.58333vw; } #main-wrapper .module3 .cartoon-box .fallen1, .pg-node-id-632, .pg-main-cs-4 { position: absolute; top: 43.05556vw; left: 0; width: 11.52778vw; height: 20.55556vw; } #main-wrapper .module3 .cartoon-box .fallen2, .pg-node-id-633, .pg-main-cs-4 { position: absolute; top: 32.5vw; right: 5.55556vw; width: 7.77778vw; height: 13.61111vw; } #main-wrapper .module3 .cartoon-box .page, .pg-node-id-634, .pg-main-cs-4 { position: absolute; top: 14.44444vw; left: 23.05556vw; width: 26.52778vw; height: 23.19444vw; z-index: 2; } #main-wrapper .module3 .cartoon-box .person, .pg-node-id-635, .pg-main-cs-4 { position: absolute; top: 9.72222vw; left: 37.5vw; width: 35.69444vw; height: 73.61111vw; } #main-wrapper .module4, .pg-node-id-636, .pg-main-cs-4 { display: none; position: relative; width: 100%; height: 188.88889vw; } #main-wrapper .module4 .module-inner, .pg-node-id-637, .pg-main-cs-4 { height: 188.88889vw; } #main-wrapper .module4 .introduce, .pg-node-id-638, .pg-main-cs-4 { position: absolute; width: 88.88889vw; left: 0; top: 28.05556vw; z-index: 4; opacity: 0; } #main-wrapper .module4 .cartoon-box, .pg-node-id-639, .pg-main-cs-4 { position: absolute; left: 50%; bottom: 0; -webkit-transform: translateX(-50%); transform: translateX(-50%); width: 100vw; height: 95vw; } #main-wrapper .module4 .cartoon-box .cartoon-text, .pg-node-id-640, .pg-main-cs-4 { position: absolute; bottom: 8.33333vw; width: 100%; font-size: 3.88889vw; line-height: 4.72222vw; color: #fff; text-align: center; } #main-wrapper .module4 .cartoon-box .cartoon-box2-pic, .pg-node-id-641, .pg-main-cs-4 { position: absolute; bottom: 0; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); width: 164.44444vw; height: 113.88889vw; } #main-wrapper .module4 .cartoon-box .leaf1, .pg-node-id-642, .pg-main-cs-4 { display: none; position: absolute; left: 0; top: 0; width: 33.88889vw; height: 95.13889vw; } #main-wrapper .module4 .cartoon-box .leaf2, .pg-node-id-643, .pg-main-cs-4 { display: none; position: absolute; left: 0; top: 0; width: 12.22222vw; height: 36.80556vw; } #main-wrapper .module4 .cartoon-box .cloud1, .pg-node-id-644, .pg-main-cs-4 { display: none; position: absolute; left: 23.05556vw; top: 35.55556vw; width: 9.44444vw; height: 6.66667vw; } #main-wrapper .module4 .cartoon-box .cloud2, .pg-node-id-645, .pg-main-cs-4 { display: none; position: absolute; right: 22.22222vw; top: 6.94444vw; width: 23.88889vw; height: 12.5vw; } #main-wrapper .module4 .cartoon-box .tree, .pg-node-id-646, .pg-main-cs-4 { display: none; position: absolute; right: 0; top: 0; width: 20.41667vw; height: 94.86111vw; } #main-wrapper .module4 .cartoon-box .grass1, .pg-node-id-647, .pg-main-cs-4 { display: none; position: absolute; left: 0; bottom: 0; width: 26.11111vw; height: 4.58333vw; } #main-wrapper .module4 .cartoon-box .grass2, .pg-node-id-648, .pg-main-cs-4 { display: none; position: absolute; right: 0; bottom: 0; width: 16.94444vw; height: 5.69444vw; } #main-wrapper .module4 .cartoon-box .person, .pg-node-id-649, .pg-main-cs-4 { display: none; position: absolute; bottom: 17.08333vw; right: 80; width: 100vw; height: 82.91667vw; } #main-wrapper .module5, .pg-node-id-650, .pg-main-cs-4 { display: none; position: relative; width: 100%; height: 188.88889vw; } #main-wrapper .module5 .module-inner, .pg-node-id-651, .pg-main-cs-4 { height: 188.88889vw; } #main-wrapper .module5 .mask-pic, .pg-node-id-652, .pg-main-cs-4 { width: 100vw; height: 188.88889vw; } #main-wrapper .module5 .introduce, .pg-node-id-653, .pg-main-cs-4 { position: absolute; top: 123.61111vw; left: 0; width: 88.88889vw; z-index: 4; } #main-wrapper .module5 .sec4-video, .pg-node-id-654, .pg-main-cs-4 { position: absolute; top: 0; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); width: 100vw; height: 188.88889vw; } #main-wrapper .module5 .sec4-video picture, .pg-node-id-655, .pg-main-cs-4 { position: absolute; width: 100%; } #main-wrapper .module5 .sec4-video video, .pg-node-id-656, .pg-main-cs-4 { display: none; position: relative; margin-top: 45.83333vw; width: 100vw; height: 56.11111vw; z-index: 2; } #main-wrapper .module5 .sec4-video #m2-sec4-canvas, .pg-node-id-657, .pg-main-cs-4 { position: relative; margin-top: 45.83333vw; width: 100vw; height: 56.11111vw; z-index: 2; } #main-wrapper .module5 .sec4-video #m2-sec4-canvas canvas, .pg-node-id-658, .pg-main-cs-4 { width: 100vw; height: 56.11111vw; } #main-wrapper .module6, .pg-node-id-659, .pg-main-cs-4 { display: none; height: 188.88889vw; } #main-wrapper .module6 .module-inner, .pg-node-id-660, .pg-main-cs-4 { height: 188.88889vw; } #main-wrapper .module6 .introduce, .pg-node-id-661, .pg-main-cs-4 { position: absolute; top: 130.83333vw; right: 0; width: 88.88889vw; z-index: 4; } #main-wrapper .module6 .sec5-video, .pg-node-id-662, .pg-main-cs-4 { position: absolute; top: 47.22222vw; right: 0; width: 47.22222vw; height: 70.55556vw; } #main-wrapper .module6 .sec5-video .module6-canvas, .pg-node-id-663, .pg-main-cs-4 { position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); width: 40.83333vw; height: 40.83333vw; } #main-wrapper .module6 .navigation, .pg-node-id-664, .pg-main-cs-4 { position: absolute; left: 50%; top: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); width: 100vw; height: 100%; } #main-wrapper .module6 .navigation .map-pic, .pg-node-id-665, .pg-main-cs-4 { position: absolute; top: 27.77778vw; right: -15.27778vw; width: 112.5vw; height: 192.5vw; } #main-wrapper .module6 .navigation .location-path-box, .pg-node-id-666, .pg-main-cs-4 { display: none; position: absolute; top: 0vw; left: 18.61111vw; width: 85.83333vw; height: 162.5vw; } #main-wrapper .module6 .navigation .location-path-box-mobile, .pg-node-id-667, .pg-main-cs-4 { position: absolute; top: 26.38889vw; left: 13.88889vw; width: 85.83333vw; height: 162.5vw; } #main-wrapper .module6 .navigation .location, .pg-node-id-668, .pg-main-cs-4 { position: absolute; top: 88.61111vw; left: 8.88889vw; width: 16.94444vw; height: 16.94444vw; } #main-wrapper .module7, .pg-node-id-669, .pg-main-cs-4 { display: none; height: 188.88889vw; } #main-wrapper .module7 .module-inner, .pg-node-id-670, .pg-main-cs-4 { height: 188.88889vw; } #main-wrapper .module7 .introduce, .pg-node-id-671, .pg-main-cs-4 { position: absolute; top: 125.55556vw; left: 0; width: 88.88889vw; z-index: 4; } #main-wrapper .module7 .sec6-video, .pg-node-id-672, .pg-main-cs-4 { position: absolute; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); top: 26.66667vw; width: 41.66667vw; height: 89.16667vw; } #main-wrapper .module7 .sec6-video .border, .pg-node-id-673, .pg-main-cs-4 { position: absolute; width: 100%; height: 100%; } #main-wrapper .module7 .sec6-video .v-cont, .pg-node-id-674, .pg-main-cs-4 { width: 41.66667vw; } #main-wrapper .module8, .pg-node-id-675, .pg-main-cs-4 { background-color: #000; display: none; height: 188.88889vw; } #main-wrapper .module8 .module-bg, .pg-node-id-676, .pg-main-cs-4 { -webkit-mask-image: none; mask-image: none; -webkit-mask-position: 0 0; mask-position: 0 0; } #main-wrapper .module8 .module-bg.on, .pg-node-id-677, .pg-main-cs-4 { -webkit-mask-image: -webkit-gradient(linear, left top, left bottom, color-stop(20%, black), color-stop(25%, rgba(0, 0, 0, 0))); -webkit-mask-image: linear-gradient(to bottom, black 20%, rgba(0, 0, 0, 0) 25%); mask-image: -webkit-gradient(linear, left top, left bottom, color-stop(20%, black), color-stop(25%, rgba(0, 0, 0, 0))); mask-image: linear-gradient(to bottom, black 20%, rgba(0, 0, 0, 0) 25%); -webkit-animation: greenBgMask 1.5s; animation: greenBgMask 1.5s; } #main-wrapper .module8 .module-bg.remove-ask, .pg-node-id-678, .pg-main-cs-4 { -webkit-mask-image: none; mask-image: none; -webkit-animation: none; animation: none; } @-webkit-keyframes greenBgMask { 0% { -webkit-mask-position: 0 -300vw; mask-position: 0 -300vw; } 100% { -webkit-mask-position: 0 0; mask-position: 0 0; } } @keyframes greenBgMask { 0% { -webkit-mask-position: 0 -300vw; mask-position: 0 -300vw; } 100% { -webkit-mask-position: 0 0; mask-position: 0 0; } } #main-wrapper .module9, .pg-node-id-679, .pg-main-cs-4 { display: none; height: 188.88889vw; } #main-wrapper .module9 .module-inner, .pg-node-id-680, .pg-main-cs-4 { height: 100%; } #main-wrapper .module9 .introduce, .pg-node-id-681, .pg-main-cs-4 { position: absolute; top: 33.33333vw; left: 0; width: 88.88889vw; } #main-wrapper .module9 .phone-box, .pg-node-id-682, .pg-main-cs-4 { position: absolute; top: 120vw; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); height: 199.72222vw; width: 136.11111vw; } #main-wrapper .module9 .phone-box .opacity-box, .pg-node-id-683, .pg-main-cs-4 { position: absolute; display: inline-block; width: 41.66667vw; height: 89.16667vw; margin-bottom: 5.55556vw; } #main-wrapper .module9 .phone-box picture, .pg-node-id-684, .pg-main-cs-4 { position: relative; width: 41.66667vw; height: 89.16667vw; margin-bottom: 5.55556vw; z-index: 5; } #main-wrapper .module9 .phone-box .white-box, .pg-node-id-685, .pg-main-cs-4 { position: absolute; width: 37.77778vw; height: 85.27778vw; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); border-radius: 3.61111vw; background-color: #fff; z-index: 4; } #main-wrapper .module9 .phone-box .phone-top, .pg-node-id-686, .pg-main-cs-4 { position: relative; height: 111.11111vw; } #main-wrapper .module9 .phone-box .phone-top .opacity-box:nth-child(1), .pg-node-id-687, .pg-main-cs-4 { left: 0; top: 15.83333vw; } #main-wrapper .module9 .phone-box .phone-top .opacity-box:nth-child(2), .pg-node-id-688, .pg-main-cs-4 { left: 47.22222vw; top: 0vw; } #main-wrapper .module9 .phone-box .phone-top .opacity-box:nth-child(3), .pg-node-id-689, .pg-main-cs-4 { right: 0vw; top: 15.83333vw; } #main-wrapper .module9 .phone-box .phone-bottom, .pg-node-id-690, .pg-main-cs-4 { position: relative; height: 89.16667vw; } #main-wrapper .module9 .phone-box .phone-bottom .opacity-box:nth-child(1), .pg-node-id-691, .pg-main-cs-4 { top: 0; bottom: 0; } #main-wrapper .module9 .phone-box .phone-bottom .opacity-box:nth-child(2), .pg-node-id-692, .pg-main-cs-4 { top: -15.83333vw; left: 47.22222vw; } #main-wrapper .module9 .phone-box .phone-bottom .opacity-box:nth-child(3), .pg-node-id-693, .pg-main-cs-4 { top: 0; right: 0vw; } #main-wrapper .module9 .tab-box, .pg-node-id-694, .pg-main-cs-4 { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-align-content: space-between; -ms-flex-line-pack: justify; align-content: space-between; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -webkit-flex-flow: row wrap; -ms-flex-flow: row wrap; flex-flow: row wrap; position: absolute; left: 0; top: 89.16667vw; width: 25.55556vw; height: 25.27778vw; padding-left: 7.22222vw; font-size: 3.88889vw; line-height: 4.72222vw; } #main-wrapper .module9 .tab-box .line, .pg-node-id-695, .pg-main-cs-4 { position: absolute; left: 0; top: 2.22222vw; width: 4.44444vw; height: 0.27778vw; background-color: #fff; -webkit-transition: all 0.5s; transition: all 0.5s; } #main-wrapper .module9 .tab-box .tab-item, .pg-node-id-696, .pg-main-cs-4 { opacity: 0.4; } #main-wrapper .module9 .tab-box .tab-item.on, .pg-node-id-697, .pg-main-cs-4 { opacity: 1; } #main-wrapper .module9 .tab-box.on1 .line, .pg-node-id-698, .pg-main-cs-4 { top: 2.22222vw; } #main-wrapper .module9 .tab-box.on1 .tab-item, .pg-node-id-699, .pg-main-cs-4 { opacity: 0.4; } #main-wrapper .module9 .tab-box.on1 .tab-item:nth-child(2), .pg-node-id-700, .pg-main-cs-4 { opacity: 1; } #main-wrapper .module9 .tab-box.on2 .line, .pg-node-id-701, .pg-main-cs-4 { top: 12.77778vw; } #main-wrapper .module9 .tab-box.on2 .tab-item, .pg-node-id-702, .pg-main-cs-4 { opacity: 0.4; } #main-wrapper .module9 .tab-box.on2 .tab-item:nth-child(3), .pg-node-id-703, .pg-main-cs-4 { opacity: 1; } #main-wrapper .module9 .tab-box.on3 .line, .pg-node-id-704, .pg-main-cs-4 { top: 22.77778vw; } #main-wrapper .module9 .tab-box.on3 .tab-item, .pg-node-id-705, .pg-main-cs-4 { opacity: 0.4; } #main-wrapper .module9 .tab-box.on3 .tab-item:nth-child(4), .pg-node-id-706, .pg-main-cs-4 { opacity: 1; } #main-wrapper .module12, .pg-node-id-707, .pg-main-cs-4 { display: none; height: 188.88889vw; } #main-wrapper .module12 .module-inner, .pg-node-id-708, .pg-main-cs-4 { height: 100%; } #main-wrapper .module12 .introduce, .pg-node-id-709, .pg-main-cs-4 { position: absolute; top: 25vw; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); width: 88.88889vw; } #main-wrapper .module12 .set-box, .pg-node-id-710, .pg-main-cs-4 { position: absolute; top: 75vw; left: 50%; -webkit-transform: translate(-50%, 0); transform: translate(-50%, 0); width: 62.5vw; height: 111.11111vw; margin: 0 auto; } #main-wrapper .module12 .set-box picture:nth-child(1), .pg-node-id-711, .pg-main-cs-4 { position: absolute; top: 0; left: 0; width: 62.5vw; height: 29.72222vw; -webkit-transition: all 1s; transition: all 1s; } #main-wrapper .module12 .set-box picture:nth-child(2), .pg-node-id-712, .pg-main-cs-4 { position: absolute; top: 65vw; left: 0; width: 29.72222vw; height: 29.72222vw; -webkit-transition: all 1.5s; transition: all 1.5s; } #main-wrapper .module12 .set-box picture:nth-child(3), .pg-node-id-713, .pg-main-cs-4 { position: absolute; top: 32.5vw; left: 0; width: 29.72222vw; height: 29.72222vw; -webkit-transition: all 1.3s; transition: all 1.3s; } #main-wrapper .module12 .set-box picture:nth-child(4), .pg-node-id-714, .pg-main-cs-4 { position: absolute; top: 32.5vw; right: 0; width: 29.72222vw; height: 29.72222vw; -webkit-transition: all 1.18s; transition: all 1.18s; } #main-wrapper .module12 .set-box picture:nth-child(5), .pg-node-id-715, .pg-main-cs-4 { position: absolute; top: 65vw; right: 0; width: 29.72222vw; height: 13.33333vw; -webkit-transition: all 1.36s; transition: all 1.36s; } #main-wrapper .module12 .set-box picture:nth-child(6), .pg-node-id-716, .pg-main-cs-4 { position: absolute; top: 81.11111vw; right: 0vw; width: 29.72222vw; height: 13.33333vw; -webkit-transition: all 1.5s; transition: all 1.5s; } #main-wrapper .module12 .set-box picture:nth-child(7), .pg-node-id-717, .pg-main-cs-4 { position: absolute; bottom: 0; left: 0; width: 62.5vw; height: 13.33333vw; -webkit-transition: all 1.35s; transition: all 1.35s; } #main-wrapper .module12 .set-box.on picture:nth-child(1), .pg-node-id-718, .pg-main-cs-4 { -webkit-transform: translate(0vw, -19.44444vw); transform: translate(0vw, -19.44444vw); } #main-wrapper .module12 .set-box.on picture:nth-child(2), .pg-node-id-719, .pg-main-cs-4 { -webkit-transform: translate(-27.77778vw, 0vw); transform: translate(-27.77778vw, 0vw); } #main-wrapper .module12 .set-box.on picture:nth-child(3), .pg-node-id-720, .pg-main-cs-4 { -webkit-transform: translate(-38.88889vw, 0vw); transform: translate(-38.88889vw, 0vw); } #main-wrapper .module12 .set-box.on picture:nth-child(4), .pg-node-id-721, .pg-main-cs-4 { -webkit-transform: translate(69.44444vw, 0vw); transform: translate(69.44444vw, 0vw); } #main-wrapper .module12 .set-box.on picture:nth-child(5), .pg-node-id-722, .pg-main-cs-4 { -webkit-transform: translate(50vw, 0vw); transform: translate(50vw, 0vw); } #main-wrapper .module12 .set-box.on picture:nth-child(6), .pg-node-id-723, .pg-main-cs-4 { -webkit-transform: translate(55.55556vw, 0vw); transform: translate(55.55556vw, 0vw); } #main-wrapper .module12 .set-box.on picture:nth-child(7), .pg-node-id-724, .pg-main-cs-4 { -webkit-transform: translate(0vw, 19.44444vw); transform: translate(0vw, 19.44444vw); } #main-wrapper .module13, .pg-node-id-725, .pg-main-cs-4 { height: 188.88889vw; display: none; } #main-wrapper .module13 .module-inner, .pg-node-id-726, .pg-main-cs-4 { height: 100%; } #main-wrapper .module13 .introduce, .pg-node-id-727, .pg-main-cs-4 { position: absolute; top: 25vw; left: 0; width: 88.88889vw; } #main-wrapper .module13 .phone-box, .pg-node-id-728, .pg-main-cs-4 { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; position: absolute; top: 82.5vw; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); width: 100vw; height: 85.55556vw; } #main-wrapper .module13 .phone-box picture, .pg-node-id-729, .pg-main-cs-4 { width: 38.33333vw; height: 85.55556vw; } #main-wrapper .module13 .phone-box :nth-child(1), .pg-node-id-730, .pg-main-cs-4 { margin-left: -13.88889vw; } #main-wrapper .module13 .phone-box picture:nth-child(3), .pg-node-id-731, .pg-main-cs-4 { margin-right: -13.88889vw; } #main-wrapper .module14, .pg-node-id-732, .pg-main-cs-4 { position: relative; display: none; width: 100vw; background-color: #000; height: 188.88889vw; } #main-wrapper .module14 .module-bg, .pg-node-id-733, .pg-main-cs-4 { position: absolute; top: 0; left: -192.22222vw; width: 336.11111vw; height: 188.88889vw; } #main-wrapper .module14 .module-inner, .pg-node-id-734, .pg-main-cs-4 { height: 100%; } #main-wrapper .module15, .pg-node-id-735, .pg-main-cs-4 { height: 188.88889vw; display: none; background-color: #000; } #main-wrapper .module15 .module-inner, .pg-node-id-736, .pg-main-cs-4 { height: 100%; } #main-wrapper .module15 .introduce, .pg-node-id-737, .pg-main-cs-4 { position: absolute; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); left: 0; z-index: 4; } #main-wrapper .module15 .neon-box, .pg-node-id-738, .pg-main-cs-4 { position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); width: 100vw; height: 188.88889vw; } #main-wrapper .module15 .neon-box .neon-item, .pg-node-id-739, .pg-main-cs-4 { position: absolute; width: 23.61111vw; height: 46.11111vw; } #main-wrapper .module15 .neon-box .neon-item picture, .pg-node-id-740, .pg-main-cs-4 { position: absolute; top: 0; left: 0; } #main-wrapper .module15 .neon-box .neon-item:nth-child(1), .pg-node-id-741, .pg-main-cs-4 { top: 11.38889vw; left: 47.22222vw; } #main-wrapper .module15 .neon-box .neon-item:nth-child(2), .pg-node-id-742, .pg-main-cs-4 { top: 145.83333vw; left: 27.77778vw; } #main-wrapper .module15 .neon-box .neon-item:nth-child(3), .pg-node-id-743, .pg-main-cs-4 { top: 16.94444vw; left: 5.55556vw; } #main-wrapper .module15 .neon-box .neon-item:nth-child(4), .pg-node-id-744, .pg-main-cs-4 { top: 124.44444vw; left: 0; } #main-wrapper .module15 .neon-box .neon-item:nth-child(5), .pg-node-id-745, .pg-main-cs-4 { top: 113.88889vw; left: 45.83333vw; } #main-wrapper .module15 .neon-box .neon-item:nth-child(6), .pg-node-id-746, .pg-main-cs-4 { top: 149.16667vw; left: 66.94444vw; } #main-wrapper .module15 .neon-box .neon-item:nth-child(7), .pg-node-id-747, .pg-main-cs-4 { top: 46.11111vw; right: 0; } #main-wrapper .module15 .neon-box .neon-item:nth-child(8), .pg-node-id-748, .pg-main-cs-4 { top: 108.61111vw; right: 0; } #main-wrapper .module15 .module13-canvas-box, .pg-node-id-749, .pg-main-cs-4 { display: none; position: absolute; top: 79.16667vw; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); width: 100vw; height: 86.94444vw; } #main-wrapper .module15 .module13-canvas-box canvas, .pg-node-id-750, .pg-main-cs-4 { width: 100vw; height: 86.94444vw; } #main-wrapper .module16.india, .pg-node-id-751, .pg-main-cs-4 { height: 188.88889vw; display: none; } #main-wrapper .module16.india .module-inner, .pg-node-id-752, .pg-main-cs-4 { height: 100%; } #main-wrapper .module16.india .sec3-bg, .pg-node-id-753, .pg-main-cs-4 { position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); width: 355.55556vw; height: 200vw; overflow: hidden; } #main-wrapper .module16.india .sec3-bg #m4-video1, #main-wrapper .module16.india .sec3-bg #m4-video3, .pg-node-id-754, .pg-main-cs-4 { display: none; } #main-wrapper .module16.india .sec3-bg #m4-video4, .pg-node-id-755, .pg-main-cs-4 { display: none; } #main-wrapper .module16.india .sec3-bg #m4-video2, .pg-node-id-756, .pg-main-cs-4 { position: absolute; left: 50%; top: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); width: 100vw; height: 188.88889vw; } #main-wrapper .module16.india .sec3-bg #m4-video2 canvas, .pg-node-id-757, .pg-main-cs-4 { height: 188.88889vw; } #main-wrapper .module16.india .introduce, .pg-node-id-758, .pg-main-cs-4 { position: absolute; top: 33.33333vw; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); z-index: 4; } #main-wrapper .module16.india .introduce .base-desc sup, .pg-node-id-759, .pg-main-cs-4 { font-size: 2.77778vw; margin: 0.55556vw 0 0 0vw; } #main-wrapper .module16.india .phone-overhidden, .pg-node-id-760, .pg-main-cs-4 { position: absolute; left: 50%; top: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); width: 100%; height: 100%; overflow: hidden; } #main-wrapper .module16.india .phone, .pg-node-id-761, .pg-main-cs-4 { position: absolute; top: 93.88889vw; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); width: 61.11111vw; height: 130.83333vw; z-index: 2; } #main-wrapper .module16.india .phone .content, .pg-node-id-762, .pg-main-cs-4 { position: absolute; top: 0; left: 0; -webkit-transition: all 0.5s; transition: all 0.5s; } #main-wrapper .module16.india .phone .border, .pg-node-id-763, .pg-main-cs-4 { position: absolute; top: 0; left: 0; } #main-wrapper .module16.india .phone.on1 .content1, .pg-node-id-764, .pg-main-cs-4 { opacity: 1; } #main-wrapper .module16.india .phone.on1 .content2, .pg-node-id-765, .pg-main-cs-4 { opacity: 0; } #main-wrapper .module16.india .phone.on1 .content3, .pg-node-id-766, .pg-main-cs-4 { opacity: 0; } #main-wrapper .module16.india .phone.on2 .content1, .pg-node-id-767, .pg-main-cs-4 { opacity: 0; } #main-wrapper .module16.india .phone.on2 .content2, .pg-node-id-768, .pg-main-cs-4 { opacity: 1; } #main-wrapper .module16.india .phone.on2 .content3, .pg-node-id-769, .pg-main-cs-4 { opacity: 0; } #main-wrapper .module16.india .phone.on3 .content1, .pg-node-id-770, .pg-main-cs-4 { opacity: 0; } #main-wrapper .module16.india .phone.on3 .content2, .pg-node-id-771, .pg-main-cs-4 { opacity: 0; } #main-wrapper .module16.india .phone.on3 .content3, .pg-node-id-772, .pg-main-cs-4 { opacity: 1; } #main-wrapper .module16.global, .pg-node-id-773, .pg-main-cs-4 { height: 188.88889vw; display: none; } #main-wrapper .module16.global .module-inner, .pg-node-id-774, .pg-main-cs-4 { height: 100%; } #main-wrapper .module16.global .sec3-bg, .pg-node-id-775, .pg-main-cs-4 { position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); width: 355.55556vw; height: 200vw; overflow: hidden; } #main-wrapper .module16.global .sec3-bg #m4-video1, #main-wrapper .module16.global .sec3-bg #m4-video3, .pg-node-id-776, .pg-main-cs-4 { display: none; } #main-wrapper .module16.global .sec3-bg #m4-video2, .pg-node-id-777, .pg-main-cs-4 { display: none; } #main-wrapper .module16.global .sec3-bg #m4-video4, .pg-node-id-778, .pg-main-cs-4 { position: absolute; left: 50%; top: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); width: 100vw; height: 188.88889vw; } #main-wrapper .module16.global .sec3-bg #m4-video4 canvas, .pg-node-id-779, .pg-main-cs-4 { height: 188.88889vw; } #main-wrapper .module16.global .introduce, .pg-node-id-780, .pg-main-cs-4 { position: absolute; top: 33.33333vw; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); z-index: 4; } #main-wrapper .module16.global .introduce .base-desc sup, .pg-node-id-781, .pg-main-cs-4 { font-size: 2.77778vw; margin: 0.55556vw 0 0 0vw; } #main-wrapper .module16.global .phone-overhidden, .pg-node-id-782, .pg-main-cs-4 { position: absolute; left: 50%; top: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); width: 100%; height: 100%; overflow: hidden; } #main-wrapper .module16.global .phone, .pg-node-id-783, .pg-main-cs-4 { position: absolute; top: 93.88889vw; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); width: 61.11111vw; height: 130.83333vw; z-index: 2; } #main-wrapper .module16.global .phone .content, .pg-node-id-784, .pg-main-cs-4 { position: absolute; top: 0; left: 0; -webkit-transition: all 0.5s; transition: all 0.5s; } #main-wrapper .module16.global .phone .border, .pg-node-id-785, .pg-main-cs-4 { position: absolute; top: 0; left: 0; } #main-wrapper .module16.global .phone.on1 .content1, .pg-node-id-786, .pg-main-cs-4 { opacity: 1; } #main-wrapper .module16.global .phone.on1 .content2, .pg-node-id-787, .pg-main-cs-4 { opacity: 0; } #main-wrapper .module16.global .phone.on1 .content3, .pg-node-id-788, .pg-main-cs-4 { opacity: 0; } #main-wrapper .module16.global .phone.on2 .content1, .pg-node-id-789, .pg-main-cs-4 { opacity: 0; } #main-wrapper .module16.global .phone.on2 .content2, .pg-node-id-790, .pg-main-cs-4 { opacity: 1; } #main-wrapper .module16.global .phone.on2 .content3, .pg-node-id-791, .pg-main-cs-4 { opacity: 0; } #main-wrapper .module16.global .phone.on3 .content1, .pg-node-id-792, .pg-main-cs-4 { opacity: 0; } #main-wrapper .module16.global .phone.on3 .content2, .pg-node-id-793, .pg-main-cs-4 { opacity: 0; } #main-wrapper .module16.global .phone.on3 .content3, .pg-node-id-794, .pg-main-cs-4 { opacity: 1; } #main-wrapper .module19, .pg-node-id-795, .pg-main-cs-4 { height: 188.88889vw; display: none; } #main-wrapper .module19 .module-inner, .pg-node-id-796, .pg-main-cs-4 { height: 100%; } #main-wrapper .module19 .introduce, .pg-node-id-797, .pg-main-cs-4 { position: absolute; top: 33.33333vw; width: 88.88889vw; } #main-wrapper .module19 .wallpaper-box, .pg-node-id-798, .pg-main-cs-4 { position: absolute; top: 90.83333vw; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; width: 136.66667vw; height: 69.44444vw; z-index: 10; overflow: hidden; } #main-wrapper .module19 .wallpaper-list, .pg-node-id-799, .pg-main-cs-4 { margin-top: -1.38889vw; -webkit-transform: translateY(calc(-3.78 * 151.11111vw)); transform: translateY(calc(-3.78 * 151.11111vw)); } #main-wrapper .module19 .wallpaper-list-one, .pg-node-id-800, .pg-main-cs-4 { -webkit-animation: picScroll 5.5s forwards; animation: picScroll 5.5s forwards; } #main-wrapper .module19 .wallpaper-list-two, .pg-node-id-801, .pg-main-cs-4 { -webkit-animation: picScroll 5.5s 0.4s forwards; animation: picScroll 5.5s 0.4s forwards; } #main-wrapper .module19 .wallpaper-list-three, .pg-node-id-802, .pg-main-cs-4 { -webkit-animation: picScroll 5.5s 0.7s forwards; animation: picScroll 5.5s 0.7s forwards; } #main-wrapper .module19 .wallpaper-list-four, .pg-node-id-803, .pg-main-cs-4 { -webkit-animation: picScroll 5.5s 1s forwards; animation: picScroll 5.5s 1s forwards; } #main-wrapper .module19 .wallpaper-item, .pg-node-id-804, .pg-main-cs-4 { width: 33.33333vw; height: 71.38889vw; } #main-wrapper .module19 .wallpaper-item picture, .pg-node-id-805, .pg-main-cs-4 { width: 33.33333vw; } @-webkit-keyframes picScroll { 0% { -webkit-transform: translateY(calc(-3.78 * 151.11111vw)); transform: translateY(calc(-3.78 * 151.11111vw)); } 100% { -webkit-transform: translateY(0); transform: translateY(0); } } @keyframes picScroll { 0% { -webkit-transform: translateY(calc(-3.78 * 151.11111vw)); transform: translateY(calc(-3.78 * 151.11111vw)); } 100% { -webkit-transform: translateY(0); transform: translateY(0); } } #main-wrapper .module20, .pg-node-id-806, .pg-main-cs-4 { height: 188.88889vw; display: none; } #main-wrapper .module20 .module-inner, .pg-node-id-807, .pg-main-cs-4 { height: 100%; } #main-wrapper .module20 .introduce, .pg-node-id-808, .pg-main-cs-4 { position: absolute; top: 33.33333vw; left: 0; } #main-wrapper .module20 .phone, .pg-node-id-809, .pg-main-cs-4 { position: absolute; top: 88.61111vw; left: 18.05556vw; width: 41.66667vw; height: 89.16667vw; } #main-wrapper .module20 .watch, .pg-node-id-810, .pg-main-cs-4 { position: absolute; top: 143.88889vw; left: 48.33333vw; width: 22.77778vw; height: 33.61111vw; } #main-wrapper .module21, .pg-node-id-811, .pg-main-cs-4 { width: 100vw; position: relative; height: 188.88889vw; display: none; left: 0; -webkit-transform: translate(0, -50%); transform: translate(0, -50%); } #main-wrapper .module21 .module-inner, .pg-node-id-812, .pg-main-cs-4 { height: 100%; } #main-wrapper .module21 .module-bg, .pg-node-id-813, .pg-main-cs-4 { position: relative; } #main-wrapper .module21 .module21-canvas, .pg-node-id-814, .pg-main-cs-4 { position: absolute; top: 0; left: -117.5vw; width: 336.11111vw; height: 188.88889vw; } #main-wrapper .module22, .pg-node-id-815, .pg-main-cs-4 { width: 100vw; height: 188.88889vw; display: none; left: 0; -webkit-transform: translate(0, -50%); transform: translate(0, -50%); } #main-wrapper .module22 .module-inner, .pg-node-id-816, .pg-main-cs-4 { height: 100%; } #main-wrapper .module22 .introduce, .pg-node-id-817, .pg-main-cs-4 { position: absolute; top: 33.33333vw; left: 0; } #main-wrapper .module22 .grident-line, .pg-node-id-818, .pg-main-cs-4 { display: none; position: absolute; top: 70.55556vw; right: 15.55556vw; width: 426.11111vw; height: 112.77778vw; -webkit-clip-path: inset(0 0 0 29.7%); clip-path: inset(0 0 0 29.7%); } #main-wrapper .module22 .grident-line-mobile, .pg-node-id-819, .pg-main-cs-4 { position: absolute; top: 104.30556vw; left: -32.77778vw; width: 119.72222vw; height: 34.72222vw; } #main-wrapper .module22 .ball-path, .pg-node-id-820, .pg-main-cs-4 { position: absolute; top: 104.44444vw; left: -5.55556vw; width: 90vw; height: 35vw; } #main-wrapper .module22 .ball-path > svg:nth-child(1), .pg-node-id-821, .pg-main-cs-4 { display: none; } #main-wrapper .module22 .ball, .pg-node-id-822, .pg-main-cs-4 { width: 6.66667vw; height: 6.66667vw; } #main-wrapper .module23, .pg-node-id-823, .pg-main-cs-4 { width: 100vw; top: 50%; left: 0%; -webkit-transform: translate(0%, -50%); transform: translate(0%, -50%); height: 188.88889vw; display: none; overflow-x: hidden; overflow-y: hidden; } #main-wrapper .module23 .module-inner, .pg-node-id-824, .pg-main-cs-4 { height: 100%; } #main-wrapper .module23 .module-bg, .pg-node-id-825, .pg-main-cs-4 { position: absolute; top: 0; left: -117.5vw; width: 336.11111vw; height: 188.88889vw; } #main-wrapper .module23 .scroll-box, .pg-node-id-826, .pg-main-cs-4 { position: relative; height: calc(121vh); overflow-x: hidden; } #main-wrapper .module23 .scroll-box > .module-inner, .pg-node-id-827, .pg-main-cs-4 { height: 188.88889vw; } #main-wrapper .module23 .scroll-box footer, .pg-node-id-828, .pg-main-cs-4 { display: block; } #main-wrapper .module23 .module19-introduce, .pg-node-id-829, .pg-main-cs-4 { position: absolute; top: 33.33333vw; left: 0; width: 88.88889vw; } #main-wrapper .module23 .module19-introduce sup, .pg-node-id-830, .pg-main-cs-4 { font-size: 4.44444vw; margin: 0 0 0 -1.38889vw; } #main-wrapper .module23 .phone, .pg-node-id-831, .pg-main-cs-4 { position: absolute; top: 88.88889vw; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); width: 61.11111vw; height: 130.55556vw; } #main-wrapper .module24, .pg-node-id-832, .pg-main-cs-4 { position: relative !important; top: 0; left: 0; -webkit-transform: none; transform: none; width: 100vw; height: 133.33333vw; background-color: #202125; background-color: #202125; } #main-wrapper .module24 .module-inner, .pg-node-id-833, .pg-main-cs-4 { padding: 16.66667vw 0; } #main-wrapper .module24 .icon, .pg-node-id-834, .pg-main-cs-4 { width: 47.22222vw; height: 47.22222vw; margin: 0 auto; } #main-wrapper .module24 .module20-introduce, .pg-node-id-835, .pg-main-cs-4 { margin-top: 16.66667vw; } #main-wrapper .module24 .module20-introduce sup, .pg-node-id-836, .pg-main-cs-4 { font-size: 2.77778vw; margin: 0 0 0 0vw; } #main-wrapper .module24 .module20-introduce .base-title, .pg-node-id-837, .pg-main-cs-4 { font-size: 7.77778vw; line-height: 9.44444vw; } #main-wrapper .module24 .module20-introduce .base-desc, .pg-node-id-838, .pg-main-cs-4 { margin-top: 5.55556vw; font-size: 4.44444vw; line-height: 5.27778vw; } #main-wrapper .module25, .pg-node-id-839, .pg-main-cs-4 { position: relative !important; top: 0; left: 0; -webkit-transform: none; transform: none; width: 100vw; height: 81.94444vw; background-color: #fff; } #main-wrapper .module25 .module-inner, .pg-node-id-840, .pg-main-cs-4 { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -webkit-flex-flow: row wrap; -ms-flex-flow: row wrap; flex-flow: row wrap; padding: 11.11111vw 0; } #main-wrapper .module25 .title, .pg-node-id-841, .pg-main-cs-4 { width: 100%; font-size: 4.44444vw; color: #828282; margin-bottom: 5.55556vw; } #main-wrapper .module25 .desc, .pg-node-id-842, .pg-main-cs-4 { width: 100%; font-size: 3.33333vw; line-height: 3.88889vw; color: #828282; margin-bottom: 5.55556vw; } #main-wrapper .module25 .desc:last-child, .pg-node-id-843, .pg-main-cs-4 { margin-bottom: 0vw; } } #main-wrapper .scroll-picture, .pg-node-id-844, .pg-main-cs-4 { overflow: hidden; } @media screen and (min-aspect-ratio: 5 / 9) and (max-aspect-ratio: 7 / 9) { #main-wrapper .module-inner, .pg-node-id-845, .pg-main-cs-4 { -webkit-transform: scale(0.87); transform: scale(0.87); } } /******** Common ********/ body, html, .pg-node-id-846, .pg-main-cs-4 { font-family: 'OnePlusSansText', Helvetica Neue, Helvetica, Arial, sans-serif; -webkit-font-feature-settings: "salt"; font-feature-settings: "salt"; } @font-face { font-family: "OnePlusSansText"; src: url(https://oasis.opstatics.com/content/dam/oasis/page/events/colors12/font/oneplustext/OnePlusSansText-55Rg.eot); /* IE9 */ src: url(https://oasis.opstatics.com/content/dam/oasis/page/events/colors12/font/oneplustext/OnePlusSansText-55Rg.eot?#iefix) format("embedded-opentype"), url(https://oasis.opstatics.com/content/dam/oasis/page/events/colors12/font/oneplustext/OnePlusSansText-55Rg.woff) format("woff"), url(https://oasis.opstatics.com/content/dam/oasis/page/events/colors12/font/oneplustext/OnePlusSansText-55Rg.ttf) format("truetype"), url(https://oasis.opstatics.com/content/dam/oasis/page/events/colors12/font/oneplustext/OnePlusSansText-55Rg.svg#OnePlusSansText-55Rg) format("svg"); /* iOS 4.1- */ font-style: normal; font-weight: normal; } /* * 初始化 */ body, .pg-node-id-847, .pg-main-cs-4 { font-family: "OnePlusSansText", "Roman-55", "Helvetica Neue", "Helvetica", "Arial", "sans-serif" !important; } .main-wrapper.arabic, .pg-node-id-848, .pg-main-cs-4 { direction: rtl; } .main-wrapper.no-navbar, .pg-node-id-849, .pg-main-cs-4 { padding-top: 0; } .main-wrapper.dark, .pg-node-id-850, .pg-main-cs-4 { color: #fff; background: #000; } .main-wrapper *, .main-wrapper ::before, .main-wrapper ::after, .pg-node-id-851, .pg-main-cs-4 { -webkit-box-sizing: border-box; box-sizing: border-box; } .main-wrapper img, .pg-node-id-852, .pg-main-cs-4 { display: block; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; pointer-events: none; } .main-wrapper canvas img, .pg-node-id-853, .pg-main-cs-4 { display: none; } .main-wrapper video, .pg-node-id-854, .pg-main-cs-4 { display: block; } .main-wrapper picture, .pg-node-id-855, .pg-main-cs-4 { display: block; } .main-wrapper picture img, .pg-node-id-856, .pg-main-cs-4 { display: block; width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; } .main-wrapper .lazyload, .main-wrapper .lazyloading, .pg-node-id-857, .pg-main-cs-4 { opacity: 0; } .main-wrapper .lazyloaded, .pg-node-id-858, .pg-main-cs-4 { opacity: 1; -webkit-transition: opacity 0.3s; transition: opacity 0.3s; } .main-wrapper .base-module-container, .pg-node-id-859, .pg-main-cs-4 { position: relative; } .main-wrapper .module, .pg-node-id-860, .pg-main-cs-4 { position: relative; width: 100%; overflow: hidden; } .main-wrapper .module-inner, .pg-node-id-861, .pg-main-cs-4 { position: relative; margin: 0 auto; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } .main-wrapper .module-inner.fixed, .pg-node-id-862, .pg-main-cs-4 { position: absolute; top: 0; right: 0; bottom: 0; left: 0; } @media only screen and (max-width: 1023px) { .main-wrapper, .pg-node-id-863, .pg-main-cs-4 { padding-top: 50px; } .main-wrapper .module-inner, .pg-node-id-864, .pg-main-cs-4 { width: 88.88889vw; } .main-wrapper .introduce, .pg-node-id-865, .pg-main-cs-4 { width: 88.88889vw; } .main-wrapper .base-title, .pg-node-id-866, .pg-main-cs-4 { font-size: 7.77778vw; line-height: 9.44444vw; } .main-wrapper .base-subtitle, .pg-node-id-867, .pg-main-cs-4 { line-height: 12.22222vw; font-size: 7.77778vw; letter-spacing: -0.05556vw; opacity: 0.55; } .main-wrapper .base-desc, .pg-node-id-868, .pg-main-cs-4 { font-family: "OnePlusSansText", "Roman-55", "Helvetica Neue", "Helvetica", "Arial", "sans-serif"; line-height: 5.27778vw; font-size: 4.44444vw; margin-top: 5.55556vw; } .main-wrapper .module-title, .pg-node-id-869, .pg-main-cs-4 { position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); width: 100%; text-align: center; z-index: 4; } .main-wrapper .module-title .title1, .pg-node-id-870, .pg-main-cs-4 { font-size: 14.44444vw; line-height: 17.22222vw; } .main-wrapper .module-title .title2, .pg-node-id-871, .pg-main-cs-4 { font-size: 4.44444vw; line-height: 5.27778vw; } } @media only screen and (min-width: 1024px) { .main-wrapper .module-inner, .pg-node-id-872, .pg-main-cs-4 { width: 67.1875vw; } .main-wrapper .section, .pg-node-id-873, .pg-main-cs-4 { position: relative; height: 1080px; } .main-wrapper .base-title, .pg-node-id-874, .pg-main-cs-4 { font-size: 3.125vw; font-weight: 400; line-height: 3.75vw; text-align: left; color: #fff; } .main-wrapper .base-subtitle, .pg-node-id-875, .pg-main-cs-4 { color: rgba(0, 0, 0, 0.55); font-size: 3.125vw; font-weight: 400; line-height: 3.75vw; text-align: center; } .main-wrapper .base-desc, .pg-node-id-876, .pg-main-cs-4 { font-family: "OnePlusSansText", "Roman-55", "Helvetica Neue", "Helvetica", "Arial", "sans-serif"; margin-top: 0.52083vw; font-size: 1.04167vw; font-weight: 400; line-height: 1.25vw; text-align: left; color: #D9D9D6; } .main-wrapper .module-title, .pg-node-id-877, .pg-main-cs-4 { position: absolute; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); width: 100%; text-align: center; letter-spacing: -0.01042vw; } .main-wrapper .module-title .title1, .pg-node-id-878, .pg-main-cs-4 { font-size: 5.20833vw; line-height: 6.25vw; } .main-wrapper .module-title .title2, .pg-node-id-879, .pg-main-cs-4 { font-size: 0.9375vw; line-height: 1.14583vw; } } @supports (-webkit-background-clip: text) { .background-clip, .pg-node-id-880, .pg-main-cs-4 { color: transparent; background-image: -webkit-gradient(linear, left bottom, left top, from(#FF692E), to(#DC9433)); background-image: linear-gradient(360deg, #FF692E 0%, #DC9433 100%); -webkit-background-clip: text; background-clip: text; } } /******** Dialog Video ********/ @-webkit-keyframes kv-bg-fadeIn { 0% { opacity: 0; } 100% { opacity: 1; } } @keyframes kv-bg-fadeIn { 0% { opacity: 0; } 100% { opacity: 1; } } @-webkit-keyframes kv-circle-fadeIn { 0% { opacity: 0; } 100% { opacity: 1; } } @keyframes kv-circle-fadeIn { 0% { opacity: 0; } 100% { opacity: 1; } } @-webkit-keyframes kv-ding-bottom-fadeIn { 0% { opacity: 0; } 100% { opacity: 1; } } @keyframes kv-ding-bottom-fadeIn { 0% { opacity: 0; } 100% { opacity: 1; } } @-webkit-keyframes kv-introduce-fadeIn { 0% { opacity: 0; margin-top: -50px; } 100% { opacity: 1; margin-top: 0px; } } @keyframes kv-introduce-fadeIn { 0% { opacity: 0; margin-top: -50px; } 100% { opacity: 1; margin-top: 0px; } } @media screen and (min-width: 1441px) { #main-wrapper .module15 .neon-box .neon-item:nth-child(3), .pg-node-id-881, .pg-main-cs-4 { top: -2.29167vw; left: 23.95833vw; } #main-wrapper .module16.global .introduce, #main-wrapper .module16.india .introduce, .pg-node-id-882, .pg-main-cs-4 { top: 5vw; } }