@charset "utf-8"; /* * * index.html * made by cloud @ 2020-8-30 10:38:32 */ /* index mer */ .indexmer { position: relative; width: 100%; overflow: hidden; background-color: rgba(0, 0, 0, 0.3); } .indexmer .container-fluid { position: relative; height: auto; width: 100%; transition: all 1s; } .indexmer .container-fluid.in { /* height: 1080px; */ } .banner-mer .swiper-button-prev, .banner-mer .swiper-button-next { position: absolute; top: 50%; width: 66px; height: 100px; margin-top: -50px; z-index: 10; cursor: pointer; background-size: 100% 100%; background-position: center; background-repeat: no-repeat; background-color: rgba(0, 0, 0, 0.6); } .banner-mer .swiper-button-prev { background-image: ; left: 0; right: auto; border-top-right-radius: 10px; border-bottom-right-radius: 10px; } .banner-mer .swiper-button-next { background-image: ; right: 0; left: auto; border-top-left-radius: 10px; border-bottom-left-radius: 10px; } .banner-mer .swiper-button-prev.swiper-button-disabled { background-image: ; opacity: 0.6; pointer-events: auto; } .banner-mer .swiper-button-next.swiper-button-disabled { background-image: ; opacity: 0.6; pointer-events: auto; } .banner-mer .swiper-scrollbar-drag { background-color: rgba(0, 185, 241, 1); } .banner-mer.swiper-container-horizontal>.swiper-scrollbar { position: absolute; left: calc((100% - 664px) / 2); bottom: 90px; z-index: 50; height: 6px; width: 664px; background-color: rgba(0, 0, 0, 0.55); } .indexmer .container { position: absolute; top: 0; left: calc((100% - 1200px) / 2); z-index: 1; } .indexmer-v { position: absolute; top: 0%; left: 0%; object-fit: cover; width: 100%; height: 100%; z-index: -1; } .indexmer-title { font-size: 60px; color: #ffffff; text-align: left; margin-top: 150px; line-height: 1.389; text-shadow: 0px 2px 5px rgba(14, 5, 10, 0.75); } .indexmer-intro1 { font-size: 26px; color: #ffffff; text-align: right; margin-top: 70px; text-shadow: 0px 2px 4px rgba(14, 5, 10, 0.75); } .indexmer-intro2 { font-size: 30px; color: #ffffff; margin-top: 90px; margin-bottom: 16px; text-shadow: 0px 6px 10px rgba(14, 5, 10, 0.75); } .indexmer-btn a { font-size: 30px; color: #ffffff; text-shadow: 0px 2px 4px rgba(14, 5, 10, 0.75); } /* 发布会模式 model-briefing */ .model-briefing{} .model-briefing .indexmer-bftitle{ font-size: 70px; color: #ffffff; /* text-align: center; */ margin-top: 150px; line-height: 1.389; text-shadow: 0px 2px 5px rgba(14, 5, 10, 0.75); } .model-briefing .indexmer-date{ font-size: 35px; color: #ffffff; /* text-align: center; */ margin-top: 20px; text-shadow: 0px 2px 4px rgba(14, 5, 10, 0.75); } /* 发布会模式 model-briefing */ .play-v-btn { display: block; position: absolute; top: 0; left: 0; width: 100%; height: 100%; cursor: auto; } .play-v-btn img { display: block; position: absolute; width: 73px; height: 73px; top: calc((100% - 73px) / 2); left: calc((100% - 73px) / 2); cursor: pointer; z-index: 1000; } .banner-mer { position: relative; } .mer-up { display: none; position: absolute; bottom: 10px; width: 60px; height: 35px; z-index: 9900; left: 50%; margin-left: -30px; } .mer-up p { width: 100%; text-align: center; color: #ffffff; font-size: 20px; text-shadow: 0px 5px 12px rgba(14, 5, 10, 0.75); } .mer-up p span { transition: all 0.3s; } .mer-up .mer-up-1 { animation: ripple2 1.5s ease-out infinite; -moz-animation: ripple2 1.5s ease-out infinite; -webkit-animation: ripple2 1.5s ease-out infinite; -o-animation: ripple2 1.5s ease-out infinite; } .mer-up-1 { position: absolute; /* top: -20px; */ } @keyframes ripple2 { 0% { top: 0px; opacity: 1; } 100% { top: 10px; opacity: 0.5; } } @-moz-keyframes ripple2 { 0% { top: 0px; opacity: 1; } 100% { top: 10px; opacity: 0.5; } } @-webkit-keyframes ripple2 { 0% { top: 0px; opacity: 1; } 100% { top: 10px; opacity: 0.5; } } @-o-keyframes ripple2 { 0% { top: 0px; opacity: 1; } 100% { top: 10px; opacity: 0.5; } } /* index mer */ /* index banner-one */ .banner-index-item { height: 890px; background-repeat: no-repeat; background-size: cover; background-position: center; } .bii-title { font-size: 70px; color: #ffffff; text-shadow: 2px 2px 6px #0e050a; line-height: 1.3; margin-top: 200px; } .bii-intro { font-size: 22px; color: #ffffff; margin-top: 32px; line-height: 1.5; } .bii-btn { margin-top: 96px; } .btn-blue { font-size: 20px; color: #ffffff; background-color: #00b9f1; border-radius: 0 15px 0 15px; padding: 10px 59px; background-image: -moz-linear-gradient( 90deg, rgb(32,163,255) 0%, rgb(62,219,242) 100%); background-image: -webkit-linear-gradient( 90deg, rgb(32,163,255) 0%, rgb(62,219,242) 100%); background-image: -ms-linear-gradient( 90deg, rgb(32,163,255) 0%, rgb(62,219,242) 100%); } /* .btn-blue { font-size: 20px; color: #ffffff; background-color: #00b9f1; border-radius: 0 15px 0 15px; padding: 10px 59px; } */ .btn-blue:hover { background-color: #09a8d8; color: #ffffff; } .banner-index-item { position: relative; } .banner-index-item-v { position: absolute; top: -10%; left: -10%; object-fit: cover; width: 120%; height: 120%; z-index: -1; } .banner-index-item .play { display: block; left: 50%; top: 50%; text-align: center; font-size: 2.42rem; position: absolute; z-index: 5; color: #ffffff; } .mvideo-x { display: none; position: fixed; width: 100%; height: 100%; top: 0; left: 0; z-index: 1000; background: rgba(0, 0, 0, 0.8); } .mvideo-x .con { position: absolute; width: 100%; top: 50%; left: 0; /* padding: 0.8rem 0 0rem; */ transform: translatey(-50%); -webkit-transform: translatey(-50%); } .mvideo-x .con video { width: 100%; } .banner-index .slick-dots { bottom: 200px; } /* index banner-one */ /* index w-banner-two */ .w-numrmb-index { margin-top: 100px !important; height: auto; } .w-numrmb-index-item { height: 100%; background-repeat: no-repeat; background-size: cover; background-position: center; } .w-numrmb-index-row{ height: 650px; display: flex; flex-direction: column; justify-content: center } .w-numrmb-index-title { font-size: 65px; line-height: 1.3; /* padding-top: 235px; */ color: #184f87; text-shadow: 0px 3px 0px rgba(255, 255, 255, 0.75); } .w-numrmb-index-main { font-size: 22px; line-height: 1.5; color: #0b3875; /* text-shadow: 0px 0px 0px rgba(255, 255, 255, 0.75); */ padding: 27px 0 0; } .w-numrmb-index.swiper-container-horizontal > .swiper-pagination-bullets{ width: 356px; display: flex; align-items: center; justify-content: center; left: 50%; transform: translatex(-50%); bottom: 40px; } .w-numrmb-index .swiper-pagination-bullet { flex: auto; height: 5px; display: inline-block; border-radius: 0; background: #ffffff; opacity: 0.9; margin: 0 !important; } .w-numrmb-index .swiper-pagination-bullet:first-child{ border-radius: 5px 0 0 5px; } .w-numrmb-index .swiper-pagination-bullet:last-child{ border-radius: 0 5px 5px 0; } .w-numrmb-index .swiper-pagination-bullet.swiper-pagination-bullet-active { background-color: rgba(0, 185, 241, 1); } /* index w-banner-two */ /* shopupgrade */ .shopupgrade{ margin: 140px auto; padding: 0 105px; } .shopupgrade-flex > .l{ flex: 1; padding-right: 30px; } .shopupgrade-flex > .l .l{ flex: 1; } .shopupgrade-flex > .l .l img{ max-width: 100%; border-radius: 20px; } .shopupgrade-flex > .l .r{ flex: 1; padding-left: 20px; padding-right: 30px; } .shopupgrade-flex > .l .r img:first-child{ max-width: 100%; border-radius: 20px; } .shopupgrade-flex > .l .r img:last-child{ max-width: calc(100% - 65px); border-radius: 20px; margin-top: 16px; } .shopupgrade-flex > .r{ flex: 1; padding-left: 70px; } .shopupgrade-flex > .r .t{ font-size: 70px; color: #333333; line-height: 1.3; margin-bottom: 90px; } .shopupgrade-flex > .r .b{} /* shopupgrade */ /* o2o 删除*/ .o2o { padding-top: 100px; padding-bottom: 100px; } .o2o-left { padding-right: 225px; } .o2o-left>img { border-radius: 24px; width: 100%; } .o2o-right, .o2o-b-right { padding-left: 0; } .o2o-right-title { font-size: 72px; line-height: 1.25; } .o2o-right-intro { font-size: 28px; color: #666666; line-height: 1.643; margin-top: 24px; } .o2o-right-btn { margin-top: 54px; padding-left: 0; } .o2o-b-right>img { border-radius: 24px; width: 100%; } .o2o-b-left { width: calc(100% - 960px); } .o2o-b-right { width: 960px; } /* o2o 删除*/ /* saas */ .saas { margin-bottom: 100px; } .saas-item { height: 999px; background-repeat: no-repeat; background-size: cover; background-position: center; } .saas-item-title { font-size: 72px; color: #fcfef1; line-height: 1.53; text-shadow: 0px 6px 12px rgba(14, 5, 10, 0.75); margin-top: 200px; } .saas-item-intro { font-size: 56px; color: #fcfef1; line-height: 1.53; text-shadow: 0px 6px 12px rgba(14, 5, 10, 0.75); margin-top: 7px; } .saas-item-video { height: 40px; line-height: 40px; margin-top: 30px; display: none; /*暂时隐藏*/ } .saas-item-video a { font-size: 24px; color: #ffffff; } .saas-item-video a img { margin-top: -6px; margin-right: 20px; width: 39px; height: 39px; display: inline; position: static; } .saas-item-btn { margin-top: 48px; } /* saas */ /* worldcanpay */ .wcanpay-item { height: 994px; background-repeat: no-repeat; background-size: cover; background-position: center; } .wcanpay-item-title { font-size: 72px; color: #3f5b77; margin-top: 185px; } .wcanpay-item-btn { margin-top: 75px; } /* worldcanpay */ /* tools */ .tools-slide { width: 92%; margin: 0 auto; padding-bottom: 90px; margin-bottom: 100px; } .tools-slide .slick-slide { opacity: 0.5; } .tools-slide .slick-center { opacity: 1; } .tools-title { font-size: 72px; text-align: center; padding-top: 157px; padding-bottom: 56px; } .tools-slide-item-x { height: 445px; background-repeat: no-repeat; background-size: 300px 260px; background-position: center 82px; padding: 25px 30px; } .tools-slide-item-x a { display: block; position: relative; height: 100%; box-shadow: 0px 4px 20px 0px rgba(14, 5, 10, 0.2); border-top-right-radius: 16px; border-bottom-left-radius: 16px; } .tools-slide-item-x a p { position: absolute; bottom: 0; height: 78px; width: 100%; line-height: 78px; font-size: 32px; color: #666666; background-color: #f6f6f6; text-align: center; border-bottom-left-radius: 16px; } /* tools */ /* pc video box */ .pcvideo-x, .pcimg-x { display: none; position: fixed; width: 100%; height: 100%; top: 0; left: 0; z-index: 99999; background: rgba(0, 0, 0, 0.9); } .pcvideo-x .con { position: absolute; width: 100%; top: 50%; left: 0; /* padding: 0.8rem 0 0rem; */ transform: translatey(-50%); -webkit-transform: translatey(-50%); text-align: center; } .pcvideo-x .con video { width: 1400px; } .pcimg-x .con img { max-width: 100%; max-height: 80vh; } .pcvideo-x .con a { display: block; width: 40px; height: 40px; position: absolute; top: -8px; right: 7%; font-size: 40px; color: #ffffff; font-weight: 300; background-image: ; background-repeat: no-repeat; background-size: 40px; } .pcimg-x .con a { display: block; width: 40px; height: 40px; position: absolute; top: -50px; right: -5px; font-size: 40px; color: #ffffff; font-weight: 300; background-image: ; background-repeat: no-repeat; background-size: 40px; } .pcvideo-x .con a i, .pcimg-x .con a i { display: none; } .pcimg-x .con { position: absolute; width: 1400px; top: 50%; left: 50%; /* padding: 0.8rem 0 0rem; */ transform: translatey(-50%) translatex(-50%); -webkit-transform: translatey(-50%) translatex(-50%); text-align: center; } /* pc video box */ /* index alert box */ .alert-x { display: flex; align-items: center; background-color: rgba(0, 0, 0, 0.5); z-index: -1; } .modal-slg { width: 1200px; } #alert-x .modal-content { border-radius: 0; border: none; box-shadow: none; background-color: transparent; } #alert-x .modal-body { padding: 0; position: relative; text-align: center; } #alert-x .modal-body .close { position: absolute; right: 0px; top: -30px; display: block; width: 22px; height: 22px; background-image: ; background-repeat: no-repeat; background-size: 22px; opacity: 0.8; } #alert-x .modal-body img { max-width: 100%; max-height: 80vh; margin: 0 auto; } #alert-x .modal-body .close:focus, #alert-x .modal-body .close:hover { opacity: 1; } .alert-x.in { z-index: 9999999; } /* index alert box */ /* 临时隐藏导航商城及视频中心部分模块 */ .mer-x:nth-child(n 4){ display: none; } /* 临时隐藏导航商城及视频中心部分模块 */