@charset "utf-8"; /* 提示弹窗 */ .common-pop * { -moz-box-sizing: border-box; box-sizing: border-box; } .common-pop img { display: block; width: 100%; height: auto; } .common-pop .pop-power { position: fixed; top: 0; bottom: 0; left: 0; right: 0; background-color: rgba(0, 0, 0, 0.5); z-index: 999; width: 100%; cursor: pointer; display: none; } .common-pop .pop-power .pop-content { width: 460px; height: 380px; position: relative; background-color: #fff; color: #000; -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); transform: translate(-50%, -50%); left: 50%; top: 50%; border-radius: 10px; } .common-pop .pop-power .pop-content .pop-tit { height: 55px; line-height: 55px; font-size: 18px; text-align: center; border-bottom: 1px solid #ededed; } .common-pop .pop-power .pop-content .pop-tit img { position: absolute; right: 10px; top: 3.8%; cursor: pointer; -moz-box-sizing: content-box; box-sizing: content-box; padding: 1.5%; width: 2.8%; } .common-pop .pop-power .pop-content .text-content { padding: 2% 2% 2% 5%; overflow-y: auto; height: 300px; margin-right: 3px; margin-top: 10px; } .common-pop .pop-power .pop-content .text-content::-webkit-scrollbar { width: 4px; height: 5px; display: block; } .common-pop .pop-power .pop-content .text-content::-webkit-scrollbar-thumb { border-radius: 5px; -webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2); background: #ccc; } .common-pop .pop-power .pop-content .text-content p { line-height: 1.3; font-size: 14px; padding-bottom: 20px; } .common-pop .app-btn { position: fixed; top: 8vw; left: 0; width: 5.5vw; cursor: pointer; z-index: 90; display: none; -webkit-transform: scale(0); -moz-transform: scale(0); -ms-transform: scale(0); -o-transform: scale(0); transform: scale(0); -webkit-transition: all 0.3s linear; -o-transition: all 0.3s linear; -moz-transition: all 0.3s linear; transition: all 0.3s linear; } .common-pop .app-btn.btn-big { -webkit-transform: scale(1); -moz-transform: scale(1); -ms-transform: scale(1); -o-transform: scale(1); transform: scale(1); } .common-pop .app-btn .bubble-img { position: absolute; right: -6vw; top: 0.5vw; -webkit-transition: none; -o-transition: none; -moz-transition: none; transition: none; width: 7vw; display: none; -webkit-transform-origin: left bottom; -moz-transform-origin: left bottom; -ms-transform-origin: left bottom; -o-transform-origin: left bottom; transform-origin: left bottom; -webkit-animation: shake 1s ease-out; -moz-animation: shake 1s ease-out; -o-animation: shake 1s ease-out; animation: shake 1s ease-out; } @-webkit-keyframes shake { 0% { -webkit-transform: translate(0, 0) scale(0); transform: translate(0, 0) scale(0); } 15% { -webkit-transform: translate(0, -1px) scale(1); transform: translate(0, -1px) scale(1); } 40% { -webkit-transform: translate(0, 1px) scale(1.05); transform: translate(0, 1px) scale(1.05); } 50% { -webkit-transform: translate(0, -1px) scale(1); transform: translate(0, -1px) scale(1); } 100% { -webkit-transform: translate(0, 0) scale(1); transform: translate(0, 0) scale(1); } } @-moz-keyframes shake { 0% { -moz-transform: translate(0, 0) scale(0); transform: translate(0, 0) scale(0); } 15% { -moz-transform: translate(0, -1px) scale(1); transform: translate(0, -1px) scale(1); } 40% { -moz-transform: translate(0, 1px) scale(1.05); transform: translate(0, 1px) scale(1.05); } 50% { -moz-transform: translate(0, -1px) scale(1); transform: translate(0, -1px) scale(1); } 100% { -moz-transform: translate(0, 0) scale(1); transform: translate(0, 0) scale(1); } } @-o-keyframes shake { 0% { -o-transform: translate(0, 0) scale(0); transform: translate(0, 0) scale(0); } 15% { -o-transform: translate(0, -1px) scale(1); transform: translate(0, -1px) scale(1); } 40% { -o-transform: translate(0, 1px) scale(1.05); transform: translate(0, 1px) scale(1.05); } 50% { -o-transform: translate(0, -1px) scale(1); transform: translate(0, -1px) scale(1); } 100% { -o-transform: translate(0, 0) scale(1); transform: translate(0, 0) scale(1); } } @keyframes shake { 0% { -webkit-transform: translate(0, 0) scale(0); -moz-transform: translate(0, 0) scale(0); -o-transform: translate(0, 0) scale(0); transform: translate(0, 0) scale(0); } 15% { -webkit-transform: translate(0, -1px) scale(1); -moz-transform: translate(0, -1px) scale(1); -o-transform: translate(0, -1px) scale(1); transform: translate(0, -1px) scale(1); } 40% { -webkit-transform: translate(0, 1px) scale(1.05); -moz-transform: translate(0, 1px) scale(1.05); -o-transform: translate(0, 1px) scale(1.05); transform: translate(0, 1px) scale(1.05); } 50% { -webkit-transform: translate(0, -1px) scale(1); -moz-transform: translate(0, -1px) scale(1); -o-transform: translate(0, -1px) scale(1); transform: translate(0, -1px) scale(1); } 100% { -webkit-transform: translate(0, 0) scale(1); -moz-transform: translate(0, 0) scale(1); -o-transform: translate(0, 0) scale(1); transform: translate(0, 0) scale(1); } } .common-pop .wecompop { position: fixed; top: 0; bottom: 0; left: 0; right: 0; background-color: rgba(0, 0, 0, 0.5); z-index: 999; width: 100%; cursor: pointer; display: none; } .common-pop .wecompop .main { width: 47.5%; top: 50%; left: 50%; position: absolute; -webkit-transform: translatex(-50%) translatey(-50%); -moz-transform: translatex(-50%) translatey(-50%); -ms-transform: translatex(-50%) translatey(-50%); -o-transform: translatex(-50%) translatey(-50%); transform: translatex(-50%) translatey(-50%); } .common-pop .wecompop .pop-close { background: url(/uploads/image/2pcimg/guanbi-b.svg) no-repeat center; -o-background-size: 100% 100%; background-size: 100% 100%; width: 1.7vw; height: 1.7vw; position: absolute; top: 1vw; right: 1.1vw; cursor: pointer; } .common-pop .app-pop { position: fixed; top: 0; bottom: 0; left: 0; right: 0; background-color: rgba(0, 0, 0, 0.5); z-index: 999; width: 100%; cursor: pointer; display: none; } .common-pop .app-pop .main { background-color: #fff; top: 50%; left: 50%; border-radius: 12px; position: absolute; font-size: 0.73vw; line-height: 1.5; overflow: hidden; max-width: 560px; color: #000; -webkit-transform: translatex(-50%) translatey(-50%) scale(0); -moz-transform: translatex(-50%) translatey(-50%) scale(0); -ms-transform: translatex(-50%) translatey(-50%) scale(0); -o-transform: translatex(-50%) translatey(-50%) scale(0); transform: translatex(-50%) translatey(-50%) scale(0); } .common-pop .app-pop .main .pop-close { background: url(/uploads/image/2pcimg/guanbi-b.svg) no-repeat center; -o-background-size: 100% 100%; background-size: 100% 100%; width: 1.7vw; height: 1.7vw; position: absolute; top: 1.1vw; right: 1.1vw; cursor: pointer; } .common-pop .app-pop .main .flex { padding: 1.2vw 3.8vw 1.5vw; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; font-size: 1.15vw; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; -webkit-justify-content: space-between; -moz-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; } .common-pop .app-pop .main .flex img { width: 6.25vw; margin: 0 1vw 0 0; } .common-pop .app-pop .main .flex-bottom { background: #f8fafc; padding: 1.2vw 3.8vw; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; color: #606060; -webkit-justify-content: space-between; -moz-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; } .common-pop .app-pop .main .a-box a { border-bottom: 1px solid #606060; display: block; margin-bottom: 0.5vw; letter-spacing: 1px; color: #606060; } .common-pop .app-pop .main .sz36 { font-size: 1.875vw; } .common-pop .app-pop .main .sz16 { font-size: 0.84vw; } .common-vr .app-btn { top: 9.5vw; } @media (max-width: 1024px) { .common-pop .app-btn { top: 17vw; left: auto; right: -25vw; width: 25vw; -webkit-transform: none; -moz-transform: none; -ms-transform: none; -o-transform: none; transform: none; -webkit-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; transition: all 0.3s ease-out; } .common-pop .app-btn.btn-big { right: 0vw; } .common-pop .app-btn.btn-small { right: -14.5vw; } .common-pop .app-btn.btn-hide { right: -50vw; } .common-pop .app-pop .main { padding: 4vw; width: 75%; max-width: 100%; } .common-pop .app-pop .main .pop-close { width: 5vw; height: 5vw; top: 2.5vw; right: 2.5vw; } .common-pop .app-pop .main .flex-bottom { display: none; } .common-pop .app-pop .main .flex { padding: 0; font-size: 3vw; } .common-pop .app-pop .main .flex > div { -webkit-flex: 1; -moz-box-flex: 1; -ms-flex: 1; flex: 1; } .common-pop .app-pop .main .flex .btn { background-color: #004e8e; border-radius: 5px; text-align: center; font-size: 2.8vw; height: 8vw; width: 100%; color: #fff; margin: 2vw 0 0; line-height: 8vw; display: block; } .common-pop .app-pop .main .flex .sz18 { font-size: 2.4vw; } .common-pop .app-pop .main .flex img { width: 24vw; margin-right: 1.5vw; } .common-pop .wecompop .main { width: 65%; } .common-pop .wecompop .pop-close { background-image: url(/uploads/image/2pcimg/guanbi-w.svg); width: 5vw; height: 5vw; top: 1.6vw; right: 1.6vw; } } @media (max-width: 767px) { .common-pop .pop-power .pop-content { width: 93.5vw; height: 93.5vw; border-radius: 8px; } .common-pop .pop-power .pop-content .pop-tit { height: 15.4vw; line-height: 15.4vw; font-size: 4.53vw; } .common-pop .pop-power .pop-content .pop-tit img { right: 2%; top: 4.8%; width: 4vw; height: 4vw; } .common-pop .pop-power .pop-content .text-content { padding: 0 2% 0% 5%; height: 72.5vw; margin-top: 2.5vw; margin-right: 1%; } .common-pop .pop-power .pop-content .text-content p { font-size: 3.2vw; padding-bottom: 4vw; } .common-pop .app-btn { top: 27vw; right: -43vw; width: 43vw; } .common-pop .app-btn.btn-small { right: -25.3vw; } .common-pop .wecompop .main { width: 87%; } .common-pop .wecompop .pop-close { top: 2.5vw; right: 2.5vw; } .common-pop .app-pop .main { border-radius: 2vw; padding: 5vw 6vw; width: 86%; } .common-pop .app-pop .main .pop-close { width: 6.3vw; height: 6.3vw; } .common-pop .app-pop .main .flex { font-size: 4vw; } .common-pop .app-pop .main .flex .btn { font-size: 3.2vw; } .common-vr .app-btn { top: 7%; } }