html,body{ }
html,
body,
.warpper{
position: relative;
}
body{ overflow-y: scroll; }
.pageBg{position: absolute;top: 0;left: 0;width: 100%;margin-top: 21.5rem;}
.pageBg.page1hasVideo{ margin-top: 18.5rem;}
.pageBg.page1Btn{ margin-top: 22.5rem;}
.pageBg .bg1{background: url('https://campaigns-static.volvocars.com.cn/image/images/2025XC70launch_20250921_op1_bg1.jpg') 0 0 no-repeat;background-size: 100% auto;height: 14.57rem;width: 100%;}
.pageBg .bg2{background: url('https://campaigns-static.volvocars.com.cn/image/images/2025XC70launch_20250921_op1_bg2.jpg') 0 0 no-repeat;background-size: 100% auto;height: 20.16rem;width: 100%;}
.pageBg .bg3{background: url('https://campaigns-static.volvocars.com.cn/image/images/2025XC70launch_20250921_op1_bg3.jpg') 0 0 no-repeat;background-size: 100% auto;height: 17.27rem;width: 100%;}
.pageBg .bg4{background: url('https://campaigns-static.volvocars.com.cn/image/images/2025XC70launch_20250921_op1_bg4.jpg') 0 0 no-repeat;background-size: 100% auto;height: 19.32rem;width: 100%;}
.pageBg .bg5{background: url('https://campaigns-static.volvocars.com.cn/image/images/2025XC70launch_20250921_op1_bg5.jpg') 0 0 no-repeat;background-size: 100% auto;height: 14rem;width: 100%;}
.pageBg .bg6{background: url('https://campaigns-static.volvocars.com.cn/image/images/2025XC70launch_20250921_op1_bg6.jpg') 0 0 no-repeat;background-size: 100% auto;height: 20.29rem;width: 100%;}
.warpper {position: relative;overflow: hidden; background: #263831;}
.animate{opacity: 0;}
.pageImg{ width: 100%; margin-top: -1px; display: block; touch-action: manipulation;}
.logo{background: url('https://campaigns-static.volvocars.com.cn/image/images/2025XC70launch_20250921_logo.png') 0 0 no-repeat;background-size: 100% auto;position: absolute;top: 0;left: 0;padding-top: 18%;width: 100%;margin-top: -1%;}
.page1{position: relative;width: 100%;height: 17rem;background: url('https://campaigns-static.volvocars.com.cn/image/images/2025XC70launch_20250921_op1_01_1.jpg') 0 0 no-repeat;background-size: 100% auto;min-height: 100vh;}
/* .page1bg{ display: none; position: absolute;width: 100%;height: 11rem;background: url('https://campaigns-static.volvocars.com.cn/image/images/202508xc702_page_bg_02_2_02.jpg') 0 0 no-repeat #263831;background-size: 100% auto;margin-top: 88%;top: 0;} */
.page1con{ height: 100vh; }
.indexText{background: url('https://campaigns-static.volvocars.com.cn/image/images/2025XC70launch_20250921_title.png') 0 0 no-repeat;background-size: 100% auto;height: 0;width: 100%;padding-top: 17%;left: 0;position: absolute;top: 0;margin-top: 24%;}
.videoItem{ position: absolute; overflow: hidden; left: 9.5%;width:81%; height: 3.43rem; background: #000000; border: 1px solid #999; margin: 98% auto 0;}
.page1Video{ overflow: hidden;}
.page1Video video{ display: block;width: 100%;height:100%; position: absolute; left: 0;top: 0; object-fit: cover; }
.page1Video .page1VideoBtn{ position: absolute; left: 0; top: 0; width: 100%; height: 100%;background: url('https://campaigns-static.volvocars.com.cn/image/images/2025XC70launch_20250921_video1.png') 0 0 no-repeat;background-size: 100% auto; }
.fullVideo{ position:fixed; left: 100%; top: 0; width: 100%; height: 100%;z-index: 9999; }
.fullVideo.show{ left:0}
.fullVideo video{ display: block;width: 100%;height:100%; position: absolute; left: 0;top: 0; object-fit: contain; background: #000000; }
.page1Text{width: 100%;top: 0;position: absolute;margin-top: 92%;}
.page1Text .page1Title{background: url('https://campaigns-static.volvocars.com.cn/image/images/2025XC70launch_20250926_op1_page1_title11.png') 0 0 no-repeat;background-size: 100% auto;height: 0;width: 100%;padding-top: 19%;margin: 0 auto;}
/* .page1Text .page1Tips{background: url('https://campaigns-static.volvocars.com.cn/image/images/202508xc70_indextitle_1_08.png') 0 0 no-repeat;background-size: 100% auto;height: 0;width: 100%;padding-top: 42%;margin: 0 auto 0;}
.page1Text .page1Tips.page1Tips2{background: url('https://campaigns-static.volvocars.com.cn/image/images/202508xc70_indextitle_1_06.png') 0 0 no-repeat;background-size: 100% auto;height: 0;width: 100%;padding-top: 42%;margin: 0 auto 0;} */
.page1hasVideo .page1Text {margin-top: 151%;}
.page1noVideo{background: url('https://campaigns-static.volvocars.com.cn/image/images/2025XC70launch_20250921_op3_page1_bg1_3.jpg') 0 0 no-repeat;background-size: 100% auto;height: 22rem;}
.page1noVideo .page1Text .page1Title{background: url('https://campaigns-static.volvocars.com.cn/image/images/2025XC70launch_20250926_op3_page1_title1.png') 0 0 no-repeat;background-size: 100% auto;height: 0;width: 100%;padding-top: 23%;margin: 0 auto;}
.page1noVideo .page1Text .page1Tips{height: 0;width: 100%;padding-top: 10%;margin: 0 auto; position: relative;}
.page1noVideo .page1Text .page1Zc1{background: url('https://campaigns-static.volvocars.com.cn/image/images/2025XC70launch_20250924_op1_page1_title1.png') 0 0 no-repeat;background-size: 100% auto;height: 0;width: 100%;padding-top: 52%;margin: 0 auto;}
.page1noVideo .page1Text .page1Zc2{background: url('https://campaigns-static.volvocars.com.cn/image/images/2025XC70launch_20250925_op1_page1_title2.png') 0 0 no-repeat;background-size: 100% auto;height: 0;width: 100%;padding-top: 43%;margin: 0 auto;}
.page1noVideo .page1Text .page1Zc3{background: url('https://campaigns-static.volvocars.com.cn/image/images/2025XC70launch_20250924_op1_page1_title3.png') 0 0 no-repeat;background-size: 100% auto;height: 0;width: 100%;padding-top: 26%;margin: 0 auto;}
/* .page1noVideo .page1Text .page1Zc4{background: url('https://campaigns-static.volvocars.com.cn/image/images/2025XC70launch_20250921_op3_page1_title4.png') 0 0 no-repeat;background-size: 100% auto;height: 0;width: 100%;padding-top: 54%;margin: 0 auto;} */
.page1noVideo.page1noDing{ height: 21rem;}
.page1noVideo.page1noDing .page1Tips{ display: none; }
.page1noVideo.page1noDing .page1Zc1{ margin-top: -3%; }
.page2-1{width: 100%;height: 0;padding-top: 10%;background: url('https://campaigns-static.volvocars.com.cn/image/images/2025XC70launch_20250923_op1_1.png') 0 0 no-repeat;background-size: 100% auto;}
.page2-2{width: 100%;height: 0;padding-top: 33.7%;background: url('https://campaigns-static.volvocars.com.cn/image/images/2025XC70launch_20250923_op1_2.png') 0 0 no-repeat;background-size: 100% auto;}
.page2-3{width: 100%;height: 0;padding-top: 33%;background: url('https://campaigns-static.volvocars.com.cn/image/images/2025XC70launch_20250924_op1_3.png') 0 0 no-repeat;background-size: 100% auto;}
.page2-4{width: 100%;height: 0;padding-top: 31.5%;background: url('https://campaigns-static.volvocars.com.cn/image/images/2025XC70launch_20250924_op1_4.png') 0 0 no-repeat;background-size: 100% auto;}
.page2-5{width: 100%;height: 0;padding-top: 53.5%;background: url('https://campaigns-static.volvocars.com.cn/image/images/2025XC70launch_20250923_op1_5.png') 0 0 no-repeat;background-size: 100% auto;}
.page3-1{width: 100%;height: 0;padding-top: 8.8%;background: url('https://campaigns-static.volvocars.com.cn/image/images/2025XC70launch_20250923_op1_6.png') 0 0 no-repeat;background-size: 100% auto;}
.page3-2{width: 100%;height: 0;padding-top: 35%;background: url('https://campaigns-static.volvocars.com.cn/image/images/2025XC70launch_20250923_op1_7.png') 0 0 no-repeat;background-size: 100% auto;}
.page3-3{width: 100%;height: 0;padding-top: 32.8%;background: url('https://campaigns-static.volvocars.com.cn/image/images/2025XC70launch_20250924_op1_8.png') 0 0 no-repeat;background-size: 100% auto;}
.page3-4{width: 100%;height: 0;padding-top: 31.6%;background: url('https://campaigns-static.volvocars.com.cn/image/images/2025XC70launch_20250923_op1_9.png') 0 0 no-repeat;background-size: 100% auto;}
.page3-5{width: 100%;height: 0;padding-top: 38.5%;background: url('https://campaigns-static.volvocars.com.cn/image/images/2025XC70launch_20250924_op1_10.png') 0 0 no-repeat;background-size: 100% auto;}
.page3-6{width: 100%;height: 0;padding-top: 32%;background: url('https://campaigns-static.volvocars.com.cn/image/images/2025XC70launch_20250923_op1_11.png') 0 0 no-repeat;background-size: 100% auto;}
.page3-7{width: 100%;height: 0;padding-top: 52%;background: url('https://campaigns-static.volvocars.com.cn/image/images/2025XC70launch_20250924_op1_12.png') 0 0 no-repeat;background-size: 100% auto;}
.page4-1{width: 100%;height: 0;padding-top: 9.5%;background: url('https://campaigns-static.volvocars.com.cn/image/images/2025XC70launch_20250923_op1_13.png') 0 0 no-repeat;background-size: 100% auto;}
.page4-2{width: 100%;height: 0;padding-top: 34.7%;background: url('https://campaigns-static.volvocars.com.cn/image/images/2025XC70launch_20250923_op1_14.png') 0 0 no-repeat;background-size: 100% auto;}
.page4-3{width: 100%;height: 0;padding-top: 93.2%;background: url('https://campaigns-static.volvocars.com.cn/image/images/2025XC70launch_20250923_op1_15.png') 0 0 no-repeat;background-size: 100% auto;}
.page5-1{width: 100%;height: 0;padding-top: 10%;background: url('https://campaigns-static.volvocars.com.cn/image/images/2025XC70launch_20250923_op1_16.png') 0 0 no-repeat;background-size: 100% auto;}
.page5-2{width: 100%;height: 0;padding-top: 34.5%;background: url('https://campaigns-static.volvocars.com.cn/image/images/2025XC70launch_20250924_op1_17.png') 0 0 no-repeat;background-size: 100% auto;}
.page5-3{width: 100%;height: 0;padding-top: 32.4%;background: url('https://campaigns-static.volvocars.com.cn/image/images/2025XC70launch_20250924_op1_18.png') 0 0 no-repeat;background-size: 100% auto;}
.page5-4{width: 100%;height: 0;padding-top: 46.4%;background: url('https://campaigns-static.volvocars.com.cn/image/images/2025XC70launch_20250924_op1_19.png') 0 0 no-repeat;background-size: 100% auto;}
.page6-1{width: 100%;height: 0;padding-top: 10%;background: url('https://campaigns-static.volvocars.com.cn/image/images/2025XC70launch_20250923_op1_20.png') 0 0 no-repeat;background-size: 100% auto;}
.page6-2{width: 100%;height: 0;padding-top: 34.3%;background: url('https://campaigns-static.volvocars.com.cn/image/images/2025XC70launch_20250923_op1_21.png') 0 0 no-repeat;background-size: 100% auto;}
.page6-3{width: 100%;height: 0;padding-top: 123%;background: url('https://campaigns-static.volvocars.com.cn/image/images/2025XC70launch_20250924_op1_22.png') 0 0 no-repeat;background-size: 100% auto;}
.page7-1{width: 100%;height: 0;padding-top: 9%;background: url('https://campaigns-static.volvocars.com.cn/image/images/2025XC70launch_20250923_op1_23.png') 0 0 no-repeat;background-size: 100% auto;}
.page7-2{width: 100%;height: 0;padding-top: 34.6%;background: url('https://campaigns-static.volvocars.com.cn/image/images/2025XC70launch_20250923_op1_24.png') 0 0 no-repeat;background-size: 100% auto;}
.page7-3{width: 100%;height: 0;padding-top: 32.6%;background: url('https://campaigns-static.volvocars.com.cn/image/images/2025XC70launch_20250923_op1_25.png') 0 0 no-repeat;background-size: 100% auto;display: none;}
.page7-4{width: 100%;height: 0;padding-top: 122%;background: url('https://campaigns-static.volvocars.com.cn/image/images/2025XC70launch_20250924_op1_26.png') 0 0 no-repeat;background-size: 100% auto;}
.page8-1{width: 100%;height: 0; margin:10% auto; padding-top: 3.5%;background: url('https://campaigns-static.volvocars.com.cn/image/images/2025XC70launch_20250921_logo2_02.png') 0 0 no-repeat;background-size: 100% auto;}
.page8-logo { position: absolute; top: 45%; left: 0; width: 100%; padding-top: 3%;}
.page8-2{width: 100%;height: 0;padding-top: 112%;background: url('https://campaigns-static.volvocars.com.cn/image/images/2025XC70launch_20250923_op1_27.png') 0 0 no-repeat;background-size: 100% auto;position: relative;}
.page8-3{width: 100%;height: 0;padding-top: 24%;background: url('https://campaigns-static.volvocars.com.cn/image/images/2025XC70launch_20250921_op1_21_1.png') 0 0 no-repeat;background-size: 100% auto;position: relative;margin-top: -9%;}
.no_toDing .page8-3{width: 100%;height: 0;padding-top: 16%;background: url('https://campaigns-static.volvocars.com.cn/image/images/2025XC70launch_20250921_op1_21_1.png') 0 0 no-repeat;background-size: 100% auto;position: relative;margin-top: 2%;}
.videoHasBtn.page8-3,.page1Btn.page8-3{ margin-top:4%}
.page8Text{width: 100%;height: 0;padding-top: 24%;background: url('https://campaigns-static.volvocars.com.cn/image/images/2025XC70launch_20250923_op1_28_2.png') 0 0 no-repeat;background-size: 100% auto;position: absolute;top: 0;}
.no_toDing .page8Text{width: 100%;height: 0;padding-top: 24%;background: url('https://campaigns-static.volvocars.com.cn/image/images/2025XC70launch_20250923_op1_28_1.png') 0 0 no-repeat;background-size: 100% auto;position: absolute;top: 0;}
.page8-4{width: 100%;height: 0;padding-top: 52%;background: url('https://campaigns-static.volvocars.com.cn/image/images/2025XC70launch_20250924_op1_page1_title1.png') 0 0 no-repeat;background-size: 100% auto;}
.page8-5{width: 100%;height: 0;padding-top: 43%;background: url('https://campaigns-static.volvocars.com.cn/image/images/2025XC70launch_20250925_op1_page1_title2.png') 0 0 no-repeat;background-size: 100% auto;}
.page8-6{width: 100%;height: 0;padding-top: 26%;background: url('https://campaigns-static.volvocars.com.cn/image/images/2025XC70launch_20250924_op1_page1_title3.png') 0 0 no-repeat;background-size: 100% auto;position: relative;}
.page8-7{width: 100%;height: 0;padding-top: 31%;background: url('https://campaigns-static.volvocars.com.cn/image/images/2025XC70launch_20250921_op3_page1_title5.png') 0 0 no-repeat;background-size: 100% auto;position: relative;}
.page8-8{width: 100%;padding-top: 33%;background: url('https://campaigns-static.volvocars.com.cn/image/images/2025XC70launch_20250925_op1_zc_1_1.png') 0 0 no-repeat;background-size: 100% auto;position: relative;}
.form-qr{width: 100%;position: relative;}
.form-qr img{ display: block; width: 100%;}
.pageTitleStm{ position: absolute; left: 0; top: 0; width: 100%; height: 0; padding-top:15%;}
/* .no_toDing.page8 .page8-1{width: 100%;height: 0;padding-top: 139.4%;background: url('https://campaigns-static.volvocars.com.cn/image/images/2025XC70launch_20250921_op4_26.jpg') 0 0 no-repeat;background-size: 100% auto;}
.no_toDing.page8 .page8-2{width: 100%;height: 0;padding-top: 66%;background: url('https://campaigns-static.volvocars.com.cn/image/images/2025XC70launch_20250921_op4_27.jpg') 0 0 no-repeat;background-size: 100% auto;position: relative;} */
.nonVideoPage .page2{ margin-top: -2.2rem;}
.page2{width: 100%;position: relative;margin-top: -17%;}
.testDriveForm{width: 92%;height: 1.26rem;position: relative;
background: url(https://campaigns-static.volvocars.com.cn/image/images/2025XC70launch_20250921_test_1_03.png) 0 0 no-repeat;
background-size: 100% auto;margin: 0 auto;transition: opacity 0.7s;}
.testDriveForm .testTips{background: url(https://campaigns-static.volvocars.com.cn/image/images/2025XC70launch_20250921_test_2_03.png) 0 0 no-repeat;background-size: 100% auto; position: absolute;width: 100%;height: 0.6rem;left: 0;top: 0;}
.form-phone{position: absolute;left: 20%;top: 0;}
.form-phone input{background: none;font-weight: 500;height: 1em;line-height: 1em;padding-bottom:0rem;font-size: 0.3rem;width: 3rem;display: block;padding-top: 0.25rem;box-sizing: content-box;padding-bottom: 0.2rem;}
.android .form-phone input{padding-top: 0.23rem; }
.testDriveForm .guo{position: absolute;width: 0.3rem;height: 0.36rem;left: 6%;top: 0;margin-top: 11%;}
.testDriveForm .guo.active{background: url(https://campaigns-static.volvocars.com.cn/image/images/2025XC90launch-products-guo.png) no-repeat 50% 32%;background-size: 80% auto;}
.testDriveForm .xieyi{position: absolute;width: 1.75rem;height: 0.4rem;left: 23%;top: 0;margin-top: 10%;}
.testDriveForm .drive-btn{position: absolute;width: 27%;height: 0.88rem;right: 6%;top: 0;margin-top: 3%;}
.testDriveFormTips{width: 100%;height: 2.8rem;margin-top: 0%;background: url(https://campaigns-static.volvocars.com.cn/image/images/202508xc702_page_bg_29.png) 0 0 no-repeat;background-size: 100% auto;margin-top: 4%;}
.usp {
width: 100%;
height: 100%;
object-fit: cover !important;
/* object-position: 50% 50%; */
/* margin-top: -1rem; */
}
.fixedBox {
position: fixed;
bottom: 0;
width: 7.5rem;
height: 1.9rem;
overflow: hidden;
opacity: 0;
z-index: 9999;
padding-top: 0.34rem;
}
.fixedBox.middle{ bottom: auto; top: 0; }
.fixedBox.hidden2{display: none;}
.textShow{
transition: opacity 0.7s; }
.textShow.hidden {
opacity: 0.1;
/* transform: translate(-50%, -20px); */
}
.testDriveForm.hidden {
opacity: 0.1;
/* transform: translate(-50%, -20px); */
}
.textShow.hidden2 { opacity: 0;}
@keyframes fadeIn {
from {opacity: 0;}
to {opacity: 1;}
}
@keyframes fadeInUp {
from {
opacity: 0;
transform: translateY(20px);
}
to {
opacity: 1;
transform: translateY(0);
}
}
.animationBegin .logo{ animation: fadeIn 0.5s ease-in-out forwards;}
.animationBegin .indexText{ animation: fadeIn 0.5s ease-in-out forwards;}
.animationBegin .page1Video{ animation: fadeIn 0.5s ease-in-out 0.4s forwards;}
.animationBegin .page1Title{ animation: fadeInUp 0.7s ease-in-out 0.8s forwards;}
.animationBegin .page1Tips{ animation: fadeInUp 0.7s ease-in-out 1s forwards;}
.animationBegin .page1Zc1,.animationBegin .page1Zc2,.animationBegin .page1Zc3{ animation: fadeInUp 0.7s ease-in-out 1.2s forwards;}
.animationBegin .fixedBox{ animation: fadeIn 0.6s ease-in-out 1.5s forwards;}
.animationBegin .page2{ animation: fadeIn 0.6s ease-in-out 2s forwards;}
.wechatBtn{
position: absolute;
top: 0;
right:30%;
width: 3.02rem;
height: 0.72rem;
/* background: url(https://campaigns-static.volvocars.com.cn/image/images/2025XC70launch_20250927_ding2.png) center top no-repeat;
background-size: contain; */
z-index: 2;
margin: 0 auto;
/* border: 1px solid #fff; */
/* border-radius: 50rem; */
}
.wechatBg{
width: 3rem;
height: 0.7rem;
border-radius: 50rem;
/* border: 0.02rem solid #fff; */
position: absolute;
left: 0.01rem;
top: 0.01rem;
}
.wechatBtnText{
/* background: conic-gradient( from var(--rotate), #fff 20%, #12241d 50%, #fff 80%); */
background: conic-gradient(
from var(--rotate),
transparent 20%, #ffffff 50%, transparent 80%
);
/* box-shadow: ; */
/* 绑定旋转动画 */
animation: rotate 1.4s linear infinite;
box-sizing: border-box;
position: absolute;
top: 0;
right: 0%;
width: 3.02rem;
height: 0.72rem;
border-radius: 50rem;
}
.wechatBtnText1{
position: absolute;
width: 2.98rem;
height: 0.68rem;
left: 0.02rem;
top: 0.02rem;
background: url(https://campaigns-static.volvocars.com.cn/image/images/2025XC70launch_20250927_ding_text.png) center center no-repeat #fff;
background-size: contain;
border-radius: 50rem;
border: 0.06rem solid #12241d;
}
.wechatBtnText1.wei{
border-color: #283438;
}
:root {
--bg: #3C465C;
--primary: #78FFCD;
--solid: #fff;
--btn-w: 3.05rem;
--dot-w: calc(var(--btn-w)*.2);
--tr-X: calc(var(--btn-w) - var(--dot-w));
}
/* .wechatBtn:before, .wechatBtn:after {box-sizing: border-box;} */
/* 声明角度变量，确保动画平滑过渡 */
@property --rotate {
syntax: "";
inherits: false;
initial-value: 0deg;
}
/* 旋转动画：从0度到360度 */
@keyframes rotate {
0% {
--rotate: 0deg;
}
100% {
--rotate: 360deg;
}
}
.dot {
content: '';
position: absolute;
top: 0;
width: var(--dot-w);
height: 100%;
border-radius: 100%;
transition: all 300ms ease;
display: none;
}
.dot:after {
content: '';
position: absolute;
left: calc(50% - .4em);
top: -.4em;
height: .8em;
width: .8em;
background: var(--primary);
border-radius: 1em;
border: .25em solid var(--solid);
box-shadow: 0 0 .7em var(--solid),
0 0 2em var(--primary);
}
.wechatBtn .dot {
animation: atom 2s infinite linear;
display: block;
}
@keyframes atom {
0% {transform: translateX(0) rotate(0);}
30%{transform: translateX(var(--tr-X)) rotate(0);}
50% {transform: translateX(var(--tr-X)) rotate(180deg);}
80% {transform: translateX(0) rotate(180deg);}
100% {transform: translateX(0) rotate(360deg);}
}
.no_toDing .wechatBtn{ display: none;}
@keyframes breathe {
0% {
opacity: 0.3;
}
90%,100% {
opacity: 1;
}
}
@keyframes imgShow {
from {
opacity: 0;
background: rgba(255, 255, 255, 0);
}
to {
opacity: 1;
background: url('https://campaigns-static.volvocars.com.cn/image/images/202508xc70_test1.png') no-repeat;
background-size: 100% 100%;
}
}
.tip {
position: fixed;
/* bottom: 130px; */
/* bottom: 110px; */
bottom: 2rem;
left: 50%;
width: 15px;
z-index: 8;
font-size: 0;
margin: 0 0 0 -7.5px;
transform: translate(0, 0);
animation-name: example;
animation-delay: 1s;
animation-duration: 1.8s;
animation-iteration-count: infinite;
}
@keyframes example {
0% {
transform: translate(0, 0);
opacity: 1;
}
25% {
opacity: 1;
}
50% {
opacity: 1;
}
100% {
transform: translate(0, 20px);
opacity: .1;
}
}
.tipTop{
position: absolute;
top: .3rem;
left: 50%;
width: 15px;
z-index: 8;
font-size: 0;
margin: 0 0 0 -7.5px;
transform: translate(0, 0);
animation-name: example22;
animation-delay: 1s;
animation-duration: 1.8s;
animation-iteration-count: infinite;
}
.logo-foot {
width: 0.64rem;
}
.toast-success {
position: fixed;
top: 0;
left: 0;
z-index: 9999;
width: 100%;
height: 100%;
text-align: center;
background: rgba(0, 0, 0, .8);
display: none;
}
.toast-success .toast-success-con {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
min-width: 3.22rem;
max-width: 3.22rem;
}
.toast-success .toast-success-con a, .toast-success .toast-success-con img {
display: block; width: 100%;
}
.toast-bomb {
position: fixed;
top: 50%;
left: 50%;
z-index: 999;
min-width: 96px;
max-width: 70%;
padding: 10px 15px;
transform: translate(-50%, -50%);
background: rgba(0, 0, 0, 0.6);
border-radius: 5px;
text-align: center;
display: none;
}
.toast-icon {
width: 40px;
padding: 10px 0 15px;
margin: 0 auto;
display: none;
}
.toast-word {
display: inline-block;
color: #fff;
font-size: 14px;
line-height: 20px;
}
.page{ position: relative;}
.pagetitle{ position: absolute;left:0; top: 0; padding-top: 20%; width: 100%; }
.pagetitle1{}
.pagetitle2{ }
.pagetitle3{ }
.pagetitle4{ }
.pagetitle5{ }
.pagetitle6{ }
.pagetitle7{ }
.boxShow{ position: relative; }
.boxShow.op1{ opacity: 1; }
.boxShow.op09{ opacity: 0.9; }
.form-tip {
font-size: .18rem;
line-height: .26rem;
color: #ffffff;
text-align: center;
margin-top: .34rem;
transform: scale(.7) translate3d(0, 0, 0);
text-align: center;
padding-bottom: 2rem;
transform-origin: center 0;
/* position: relative; */
}
.form-tip .icpherf{
color: #ffffff;
text-decoration: underline;
}
.inView .title{ animation: fadeInUp 0.5s ease-in-out forwards;}
.inView .img{animation: fadeInUp 0.7s ease-in-out 0.4s forwards;}
.container {
max-width: 900px;
width: 100%;
background-color: rgba(0, 0, 0, 0.8);
border-radius: 15px;
box-shadow: 0 10px 30px rgba(0, 0, 0, 0.5);
overflow: hidden;
}
.video-container {
position: relative;
width: 100%;
padding-top: 56.25%; /* 16:9 宽高比 */
}
#myVideo {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: #000;
}
.controls-container {
position: absolute;
bottom: 0;
left: 0;
width: 100%;
background: linear-gradient(to top, rgba(0,0,0,0.7), transparent);
padding: 0.1rem;
display: flex;
flex-direction: column;
transition: opacity 0.3s;
}
.progress-container {
width: 100%;
height: 0.05rem;
background-color: rgba(255, 255, 255, 0.2);
border-radius: 4px;
margin-bottom: 0.1rem;
cursor: pointer;
position: relative;
display: none;
}
.progress-bar {
height: 100%;
background: linear-gradient(to right, #999999, #ffffff);
border-radius: 4px;
width: 0%;
transition: width 0.1s;
}
.controls-row {
display: flex;
justify-content: space-between;
align-items: center;
}
.left-controls, .right-controls {
display: flex;
align-items: center;
}
.control-btn {
background: none;
border: none;
color: white;
font-size: 0.18rem;
/* margin: 0 10px; */
cursor: pointer;
transition: all 0.2s;
width: 0.6rem;
height: 0.6rem;
display: flex;
align-items: center;
justify-content: center;
border-radius: 50%;
}
.control-btn.play-pause.playing{ background: url(https://campaigns-static.volvocars.com.cn/image/images/paused_03.png) center center no-repeat;
background-size: 50%;}
.control-btn.play-pause.paused{ background: url(https://campaigns-static.volvocars.com.cn/image/images/play_03.png) center center no-repeat;
background-size: 50%;}
.time-display {
display: none;
color: white;
font-size: 0.14rem;
margin: 0 0.02rem;
}
.volume-container {
display: flex;
align-items: center;
}
.fullscreen-btn{
background: url(https://campaigns-static.volvocars.com.cn/image/images/big_03.png) center center no-repeat;
background-size: 50%;
}
.fullscreen-btn.full{ background: url(https://campaigns-static.volvocars.com.cn/image/images/small_03.png) center center no-repeat;
background-size: 50%;}
.volume-btn.mutedFalse{ background: url(https://campaigns-static.volvocars.com.cn/image/images/volume2_03.png) center center no-repeat;
background-size: 50%;}
.volume-btn.mutedTrue{ background: url(https://campaigns-static.volvocars.com.cn/image/images/volume1_03.png) center center no-repeat;
background-size: 50%;}
/* .title {
color: white;
text-align: center;
padding: 15px;
font-size: 24px;
background: rgba(0, 0, 0, 0.5);
} */
.instructions {
color: white;
text-align: center;
padding: 10px;
font-size: 14px;
background: rgba(0, 0, 0, 0.3);
}
/* 全屏样式 */
.fullscreen {
position: fixed !important;
top: 0 !important;
left: 0 !important;
width: 100% !important;
height: 100% !important;
z-index: 9999;
border-radius: 0 !important;
}
/* 加载动画 */
.loading {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
color: white;
font-size: 18px;
}
.fullVideo .control-btn{ width: 1rem; height: 1rem; }
.fullVideo .time-display{ font-size: 0.3rem;}