.backgroundContainer.data-v-d5065f48 { display: flex; position: relative; width: 100%; height: 100vh; background-image: url('../../static/index/lightbgcnew.png'); background-size: cover; background-position: center center; overflow: hidden; } .darkbackgroundContainer.data-v-d5065f48 { display: flex; position: relative; width: 100%; height: 100vh; background-image: url('../../static/index/background.png'); background-size: cover; background-position: center center; overflow: hidden; } .doctorsay-container-container.data-v-d5065f48 { border: 2rpx solid #fff; width: calc(100% - 4rpx); height: calc(100vh - 4rpx); /* 设置背景图和白色背景 */ background: url("../../static/index/lightbgcnew.png") center / cover, rgba(255, 255, 255, 0.3); -webkit-backdrop-filter: blur(20rpx); backdrop-filter: blur(20rpx); /* 使用 screen 混合模式,让图像与白色混合变淡 */ background-blend-mode: screen; border-radius: 30rpx; box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.1); /* 右下角阴影 */ overflow: hidden; } .doctorsay-container-container .super-card-end.data-v-d5065f48 { width: 100%; display: flex; } .doctorsay-container-container .super-card-end .super-end-father.data-v-d5065f48 { height: 100%; display: flex; flex-direction: column; width: 100%; } .doctorsay-container-container .super-card-end .super-end-father .super-end-items-all.data-v-d5065f48 { width: calc(100% - 85rpx); height: 200rpx; margin-left: 40rpx; margin-right: 40rpx; margin-top: 20rpx; } .doctorsay-container-container .super-card-end .super-end-father .super-end-items.data-v-d5065f48 { display: flex; width: calc(100% - 85rpx); height: 200rpx; } .doctorsay-container-container .super-card-end .super-end-father .super-end-items .super-end-items-father.data-v-d5065f48 { margin-right: 20rpx; width: 150rpx; height: 150rpx; display: flex; justify-content: center; align-items: center; flex-direction: column; position: relative; background: linear-gradient(to bottom right, #fff 0%, #dcdcf9 50%, #dbdcf8 100%); border-radius: 25rpx; border: 2rpx solid #fff; box-shadow: 10rpx 10rpx 20rpx rgba(0, 0, 0, 0.1); transition: all 1.5s ease-in-out; } .doctorsay-container-container .super-card-end .super-end-father .super-end-items .super-end-items-father .super-end-items-father-close-father.data-v-d5065f48 { width: 40rpx; height: 40rpx; border-radius: 50%; display: flex; background-color: #0184db; justify-content: center; align-items: center; position: absolute; top: 0rpx; right: 0rpx; z-index: 10; color: #fff; } .doctorsay-container-container .super-card-end .super-end-father .super-end-items .super-end-items-father .super-end-items-img-father.data-v-d5065f48 { width: 100rpx; height: 100rpx; border-radius: 50%; display: flex; justify-content: center; align-items: center; /* 让正方形变成圆 */ } .doctorsay-container-container .super-card-end .super-end-father .super-end-items .super-end-items-father .super-end-items-img-father .super-end-items-img.data-v-d5065f48 { width: 85rpx; height: 85rpx; } .doctorsay-container-container .super-card-end .super-end-father .super-end-items .super-end-items-father .super-end-items-img-father-active.data-v-d5065f48 { width: 100rpx; height: 100rpx; border-radius: 50%; display: flex; justify-content: center; align-items: center; animation: shake 0.5s infinite; /* 让正方形变成圆 */ } .doctorsay-container-container .super-card-end .super-end-father .super-end-items .super-end-items-father .super-end-items-img-father-active .super-end-items-img.data-v-d5065f48 { width: 85rpx; height: 85rpx; } .doctorsay-container-container .super-card-end .super-end-father .super-end-items .super-end-items-father .super-end-items-font.data-v-d5065f48 { margin-top: -10rpx; font-size: 25rpx; } .doctorsay-container-container .super-card-end .super-end-father .super-end-font-father.data-v-d5065f48 { display: flex; margin-top: 20rpx; margin-bottom: 10rpx; } .doctorsay-container-container .super-card-end .super-end-father .super-end-font-father .super-end-font-gun.data-v-d5065f48 { margin-left: 40rpx; margin-right: 20rpx; margin-top: 5rpx; width: 13rpx; height: 40rpx; background: linear-gradient(to bottom, #04BCED, #0160CE); border-radius: 10rpx; } .doctorsay-container-container .super-card-end .super-end-father .super-end-font-father .super-end-font-font.data-v-d5065f48 { font-size: 38rpx; font-weight: 700; } .doctorsay-container-container .doctorsay-container-title.data-v-d5065f48 { width: 100%; height: 105rpx; margin-top: 50rpx; display: flex; align-items: center; justify-content: space-between; } .doctorsay-container-container .doctorsay-container-title .doctorsay-container-right.data-v-d5065f48 { height: 100%; display: flex; align-items: center; width: 800rpx; } .doctorsay-container-container .doctorsay-container-title .doctorsay-container-right .doctorsay-container-juzhen.data-v-d5065f48 { background: linear-gradient(to right bottom, #00c9ff, #0076ff); color: #fff; display: flex; justify-content: center; align-items: center; padding: 10rpx 20rpx; border-radius: 20rpx; font-size: 27rpx; } .doctorsay-container-container .doctorsay-container-title .doctorsay-container-right .doctorsay-container-button-father.data-v-d5065f48 { display: flex; } .doctorsay-container-container .doctorsay-container-title .doctorsay-container-right .doctorsay-container-button-father .doctorsay-container-button-target.data-v-d5065f48 { display: flex; justify-content: center; align-items: center; background-color: #3FA9F5; color: #fff; width: 140rpx; height: 60rpx; margin-right: 20rpx; font-size: 28rpx; border-radius: 10rpx; } .doctorsay-container-container .doctorsay-container-title .doctorsay-container-right .doctorsay-container-button-father .doctorsay-container-button.data-v-d5065f48 { display: flex; justify-content: center; align-items: center; background-color: #fff; width: 140rpx; height: 60rpx; margin-right: 20rpx; font-size: 28rpx; border-radius: 10rpx; } .doctorsay-container-container .doctorsay-container-title .doctorsay-container-right .doctorsay-container-right-kuai-cheng.data-v-d5065f48 { background-color: #FFDBA1; height: 35rpx; width: 35rpx; border-radius: 7rpx; } .doctorsay-container-container .doctorsay-container-title .doctorsay-container-right .doctorsay-container-right-kuai-zi.data-v-d5065f48 { background-color: #7B61FF; height: 35rpx; width: 35rpx; border-radius: 7rpx; } .doctorsay-container-container .doctorsay-container-title .doctorsay-container-right .doctorsay-container-kuai-font.data-v-d5065f48 { font-size: 32rpx; margin-left: 10rpx; margin-right: 25rpx; } .doctorsay-container-container .doctorsay-container-title .doctorsay-container-left.data-v-d5065f48 { display: flex; } .doctorsay-container-container .doctorsay-container-title .doctorsay-container-left .doctorsay-container-left-gun.data-v-d5065f48 { margin-top: 7rpx; margin-left: 40rpx; margin-right: 20rpx; width: 13rpx; height: 40rpx; background: linear-gradient(to bottom, #04BCED, #0160CE); border-radius: 10rpx; } .doctorsay-container-container .doctorsay-container-title .doctorsay-container-left .doctorsay-container-left-font.data-v-d5065f48 { font-size: 38rpx; font-weight: 700; } .super-card.data-v-d5065f48 { display: flex; justify-content: center; width: 100%; height: calc(100% - 200rpx); } .super-card .scroll-x.data-v-d5065f48 { height: 100%; width: 100%; } .super-card .super-card-container.data-v-d5065f48 { /* 设置背景图和白色背景 */ background: url("../../static/index/clearmountain.png") center / cover, rgba(255, 255, 255, 0.5); /* 使用 screen 混合模式,让图像与白色混合变淡 */ background-blend-mode: screen; isolation: isolate; overflow: hidden; width: calc(100% - 100rpx); height: 100%; border-radius: 20rpx; border: 2rpx solid #fff; box-shadow: 10rpx 10rpx 20px rgba(0, 0, 0, 0.1); position: relative; } .super-card .super-card-time.data-v-d5065f48 { display: flex; justify-content: center; align-items: center; height: 80rpx; width: 247rpx; border-right: 1rpx solid transparent; border-image: repeating-linear-gradient(180deg, #0184db 0px, #0184db 6rpx, transparent 6rpx, transparent 12rpx) 1; font-weight: 700; } .super-card .super-card-time-und.data-v-d5065f48 { display: flex; justify-content: center; align-items: center; width: 247rpx; flex-direction: column; border-right: 1rpx solid transparent; border-image: repeating-linear-gradient(180deg, #0184db 0px, #0184db 6rpx, transparent 6rpx, transparent 12rpx) 1; } .super-card .super-card-time-card.data-v-d5065f48 { display: flex; justify-content: center; align-items: center; height: 153rpx; width: calc(100%); border-top: 1rpx solid transparent; border-image: repeating-linear-gradient(90deg, #0184db 0px, #0184db 6rpx, transparent 6rpx, transparent 12rpx) 1; flex-direction: column; position: relative; } .title-time-border-blue.data-v-d5065f48 { z-index: 999; background: linear-gradient(to right, #0184db, #0184db) top left / 60rpx 8rpx no-repeat, /* 左上角垂直 */ linear-gradient(to bottom, #0184db, #0184db) top left / 8rpx 60rpx no-repeat, /* 右上角水平 */ linear-gradient(to left, #0184db, #0184db) top right / 60rpx 8rpx no-repeat, /* 右上角垂直 */ linear-gradient(to bottom, #0184db, #0184db) top right / 8rpx 60rpx no-repeat, /* 左下角水平 */ linear-gradient(to right, #0184db, #0184db) bottom left / 60rpx 8rpx no-repeat, /* 左下角垂直 */ linear-gradient(to top, #0184db, #0184db) bottom left / 8rpx 60rpx no-repeat, /* 右下角水平 */ linear-gradient(to left, #0184db, #0184db) bottom right / 60rpx 8rpx no-repeat, /* 右下角垂直 */ linear-gradient(to top, #0184db, #0184db) bottom right / 8rpx 60rpx no-repeat; } .title-time-border-yellow.data-v-d5065f48 { margin: 10rpx; border: 2rpx solid #d0d8e0; background: linear-gradient(to bottom, #fff1db, #ffe2b2); width: calc(100% - 20rpx); height: calc(100% - 20rpx); border-radius: 20rpx; display: flex; align-items: center; flex-direction: column; box-shadow: 6rpx 6rpx 12rpx rgba(255, 138, 0, 0.7); } .title-time-border-pouple.data-v-d5065f48 { margin: 10rpx; border: 1rpx solid #dae8fa; background: linear-gradient(to bottom, #f1eeff, #e3deff); width: calc(100% - 20rpx); height: calc(100% - 20rpx); border-radius: 20rpx; display: flex; align-items: center; flex-direction: column; box-shadow: 6rpx 6rpx 12rpx rgba(123, 97, 255, 0.7); } .title-time-border.data-v-d5065f48 { margin-top: 4rpx; margin-left: 4rpx; width: calc(100% - 8rpx); height: calc(100% - 8rpx); border-radius: 20rpx; display: flex; align-items: center; flex-direction: column; } .title-time.data-v-d5065f48 { display: flex; width: 100%; position: relative; } .title-time .title-time-time.data-v-d5065f48 { font-size: 32rpx; margin-left: 40rpx; margin-top: 12rpx; } .title-time .title-time-button.data-v-d5065f48 { position: absolute; top: -4rpx; right: -4rpx; width: 65rpx; height: 60rpx; } .title-time .title-time-zhejiao.data-v-d5065f48 { position: absolute; top: 0rpx; left: 5rpx; width: 40rpx; height: 40rpx; } .title-time .title-time-font.data-v-d5065f48 { position: absolute; top: 7rpx; right: 5rpx; font-size: 20rpx; color: #fff; } .down-icons.data-v-d5065f48 { margin-top: 5rpx; width: 100%; height: 58rpx; background-color: #ffd87e; display: flex; justify-content: center; align-items: center; } .down-icons .icon.data-v-d5065f48 { margin: 0 5rpx; font-size: 20rpx; padding: 3rpx 5rpx; background-color: #ff8a00; color: #fff; border-radius: 5rpx; } .popup-overlay.data-v-d5065f48 { position: fixed; top: 0; left: 0; right: 0; bottom: 0; display: flex; justify-content: center; align-items: center; /* 添加毛玻璃效果 */ z-index: 998; } .popup-overlay .popup-overlay-content.data-v-d5065f48 { position: absolute; display: flex; align-items: center; width: 800rpx; height: 390rpx; background-color: #fff; border-radius: 30rpx; box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.1); opacity: 0; transition: opacity 0.4s ease; } .popup-overlay .popup-overlay-content .popup-overlay-content-left.data-v-d5065f48 { height: 100%; width: 350rpx; display: flex; justify-content: center; align-items: center; flex-direction: column; } .popup-overlay .popup-overlay-content .popup-overlay-content-left .popup-overlay-content-left-img.data-v-d5065f48 { width: 280rpx; height: 180rpx; margin-top: -30rpx; } .popup-overlay .popup-overlay-content .popup-overlay-content-left .popup-overlay-content-left-font.data-v-d5065f48 { font-size: 30rpx; } .popup-overlay .popup-overlay-content .popup-overlay-content-right.data-v-d5065f48 { height: 100%; width: 450rpx; position: relative; } .popup-overlay .popup-overlay-content .popup-overlay-content-right .time-font.data-v-d5065f48 { font-size: 50rpx; margin-top: 100rpx; margin-bottom: 10rpx; font-weight: 700; background: linear-gradient(to bottom, #7080A1, #263556); -webkit-background-clip: text; color: transparent; } .popup-overlay .popup-overlay-content .popup-overlay-content-right .time-text.data-v-d5065f48 { margin-left: 10rpx; font-size: 30rpx; width: 380rpx; margin-bottom: 50rpx; line-height: 35rpx; } .popup-overlay .popup-overlay-content .popup-overlay-content-right .right-richang.data-v-d5065f48 { background-color: #FFC363; position: absolute; top: 108rpx; right: 50rpx; padding: 5rpx; border-radius: 10rpx; } .popup-overlay .popup-overlay-content .popup-overlay-content-right .right-richangnot.data-v-d5065f48 { background-color: #7B61FF; position: absolute; top: 108rpx; right: 50rpx; padding: 5rpx; border-radius: 10rpx; color: #fff; } .popup-overlay .popup-overlay-content .popup-overlay-content-right .right-crush.data-v-d5065f48 { position: absolute; top: 20rpx; right: 20rpx; width: 70rpx; height: 70rpx; animation: shake 0.5s 3; } .titlebutton-father.data-v-d5065f48 { display: flex; margin-right: 20rpx; } .titlebutton-father .titlebutton.data-v-d5065f48 { background-color: #fff; display: flex; justify-content: center; align-items: center; padding: 10rpx 30rpx; border-radius: 20rpx; font-size: 27rpx; margin-right: 10rpx; } .titlebutton-father .titlebutton-target.data-v-d5065f48 { background: linear-gradient(to right bottom, #00c9ff, #0076ff); color: #fff; display: flex; justify-content: center; align-items: center; padding: 10rpx 30rpx; border-radius: 20rpx; font-size: 27rpx; margin-right: 10rpx; } .titlebutton-father .titlebutton-target-yellow.data-v-d5065f48 { background: #FFDBA1; display: flex; justify-content: center; align-items: center; padding: 10rpx 30rpx; border-radius: 20rpx; font-size: 27rpx; margin-right: 10rpx; } .titlebutton-father .titlebutton-target-pouple.data-v-d5065f48 { background: #7B61FF; color: #fff; display: flex; justify-content: center; align-items: center; padding: 10rpx 30rpx; border-radius: 20rpx; font-size: 27rpx; margin-right: 10rpx; } .boom.data-v-d5065f48 { position: absolute; top: 80rpx; left: 0rpx; width: 30rpx; height: 1500rpx; display: flex; flex-direction: column; align-items: center; overflow: hidden; z-index: 10; } .boom .boom-son.data-v-d5065f48 { height: 153rpx; width: 100%; font-size: 22rpx; letter-spacing: 5rpx; -webkit-writing-mode: vertical-rl; writing-mode: vertical-rl; /* 竖排文字,从右往左 */ text-align: center; z-index: 10; /* 确保文字在容器内居中 */ background: linear-gradient(to bottom, #ffe2b2, #e3deff); border-bottom-right-radius: 40rpx; border-top-right-radius: 40rpx; } .boom .boom-son-target.data-v-d5065f48 { height: 153rpx; width: 100%; font-size: 22rpx; letter-spacing: 5rpx; -webkit-writing-mode: vertical-rl; writing-mode: vertical-rl; /* 竖排文字,从右往左 */ text-align: center; z-index: 10; /* 确保文字在容器内居中 */ background: linear-gradient(to bottom, #ff8a00, #eceaff); border-bottom-right-radius: 40rpx; border-top-right-radius: 40rpx; }