crm/resources/xqzqxg/index/pages/casemsg/casemsg.wxss

.image-box {
    width: 100%;
    height: 450rpx;
    overflow: hidden;
    position: relative;
}
.overflowHidden {
    width: 100%;
    height: 95vh;
    overflow: hidden;
}
.vr-box {
    width: 120rpx;
    height: 65rpx;
    position: absolute;
    z-index: 9;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    color: #fff;
    font-size: 36rpx;
}
.vr-box > image {
    width: 100%;
}
.image-box image {
    width: 100%;
}
.cover{
  display: block;
  width: 100%;
  height: auto;
  min-height: 450rpx;
}
.saleperson{
  display: block;
  width: 92%;
  height: 160rpx;
  background-color: #ffffff;
  overflow: hidden;
  border-radius: 10rpx;
  position: absolute;
  top:20rpx;
  left: 4%;
  z-index: 2;
  padding: 31rpx 24rpx;
  box-sizing: border-box;
}
.saleperson .headimgbox{
  display: block;
  width: 98rpx;
  height: 98rpx;
  border-radius: 50%;
  border: 4rpx solid #347af6;
}
.saleperson .headimgbox image{
  display: block;
  width: 100%;
  height: 100%;
  border-radius: 50%;
}
.saleperson .phonebox{
  display: block;
}
.phonebox .phoneimg{
  display: block;
  width: 60rpx;
  height: 60rpx;
  background-color: rgba(52, 122, 246, 0.2);
  border-radius: 50%;
  margin: 0 auto 4rpx;
}
.phonebox image{
  display: block;
  width: 32rpx;
  height: 32rpx;
  margin: 14rpx auto;
}
.personmsgbox{
  margin-left: 16rpx;
  margin-top: 8rpx;
}
.titbox .titbg{
  display: block;
  width:100%;
  position: absolute;
  top: 0;
  left:0;
}
.wlast{
  position: absolute;
  display: block;
  width:20rpx;
  height: 36rpx;
  left: 20rpx;
  bottom: 16rpx;
  z-index: 10;
}
.titmsg{
  padding: 30rpx 10rpx 0 10rpx;
}

.designerbox{
  display: block;
  width: 670rpx;
  background-color: #f7f7f7;
  border-radius: 10rpx;
  box-sizing: border-box;
  padding: 30rpx;
  margin:28rpx auto 40rpx;
}
image.designerimg{
  display: block;
  width: 80rpx;
  height: 80rpx;
  border-radius: 40rpx;
}
.designermsgbox{
  margin-left: 32rpx;
}
.qrcodeimg{
  display:block;
  width: 80rpx;
  height: 80rpx;
}
.designstylebox{
  width: 450rpx;
}
.orderbtn{
  display: block;
  width: 154rpx;
  height: 80rpx;
  line-height: 80rpx;
  border-radius: 40rpx;
  background-image: linear-gradient(180deg, #4ACDFD 0%, #249EFB 100%);

}
.casemsgbox{
  display: block;
  background-color: #FFFFFF;
  position: relative;
  z-index: 1;
}
.casemsgbox{
  width: 730rpx;
  margin: 40rpx auto; 
  background-color: #ffffff;
  border-radius: 10rpx;
  border: 2rpx solid #ececec;
  box-sizing: border-box;
  padding: 40rpx 20rpx;
}
.everycasemsg{
  padding-left: 32rpx;
  box-sizing: border-box;
}
.casepricebox view{
  height:32rpx;
  overflow:hidden;
  margin-top:24rpx;
}



.configtitbox{
  display: block;
  background: #F0F4F7;
  width:100%;
  height:88rpx;
  padding-left: 20rpx;
  position: relative;
}
.configtitbox image{
  display: block;
  width: 32rpx;
  height: 32rpx;
  margin-right: 16rpx;
  position: relative;
  top: 28rpx;
}

.configmsg{
  padding: 24rpx 10rpx 32rpx;
  font-size: 24rpx;
}
.setimebox{
  padding: 0rpx 10rpx 32rpx;
  color: #b8b8b8;
}
.configmsg  image{
  max-width: 100%;
  height: auto;
}
.fbg{
  display: block;
  width: 100%;
  height:16rpx;
  background: #F0F4F7;
}
.switchview{
  display: block;
  padding: 40rpx;
}
.switchbox{
  display: block;
  width: 216rpx;
  height: 80rpx;
  border: 2rpx solid #9DB6CF;
  line-height: 76rpx;
  border-radius: 40rpx;
  overflow: hidden;
}
.switchbox image{
  display: block;
  width: 16rpx;
  height: 28rpx;
  position: relative;
  top:24rpx;
}
.designcasebox{
  display: block;
  width: 100%;
  background: #ffffff;
  padding-top: 32rpx;
  border-top: 1px solid #eaeaea;
  padding-bottom: 140rpx;
}
.designcasetit{
  padding: 0 20rpx;
}
.designcasetit view{
  /* margin-left: 24rpx; */
}


/* 装修案例 */
.caselistbox{
  padding: 24rpx 20rpx 0;
}
.everycasebox{
  width: 100%;
  box-shadow: 0 4rpx 20rpx 0 rgba(36,158,251,0.26);
  border-radius: 10rpx;
  overflow: hidden;
  margin-bottom: 20rpx;
}
.leftcasebox{
  margin-right: 20rpx;
}
.leftcasebox,.rightcasebox{
  width: 345rpx;
  overflow: initial;
}
.caselistbox .everycasebox .imgbox image{
  display: block;
  width: 100%;
}
.casesharenum{
  position: absolute;
  right:0;
  top: 12rpx;
  height: 40rpx;
  border-radius: 24rpx 0 0 24rpx;
  opacity: 0.7;
  background: #384855;
  color: #B6CADE;
  padding-left: 20rpx;
  padding-right: 10rpx;
}
.caselistbox .everycasebox .imgbox .casesharenum image{
  display: block;
  width: 22rpx;
  height: 21rpx;
  margin-right:4rpx;
  position: relative;
  top: 11rpx;
}
.caselistbox .everycasebox .imgbox .casesharenum view{
  line-height: 40rpx;
}
.c-client {
    margin-left: 30rpx;
}

.casehousemsgbox{
  line-height: 32rpx;
  margin-top: 6rpx;
  font-size: 22rpx;
}


.lookmore{
  display: block;
  width: 444rpx;
  height: 88rpx;
  border: 2rpx solid #9DB6CF;
  border-radius: 40rpx;
  line-height: 84rpx;
  margin: 40rpx auto;
}
.casemsgbox1{
  padding: 20rpx 10rpx 30rpx;
}
/* .designerbox image{
  display: block;
  width: 40rpx;
  height: 40rpx;
  margin-right: 10rpx;
} */
.casemsgbox1 .designerbox{
  padding: 0;
  width: auto;
  margin: 0;
  background: #fff;
}


.updateBox {
    width: 730rpx;
    height: auto;
    overflow: hidden;
    padding: 20rpx;
    background-color: #EFF4F8;
    display: flex;
    align-items: center;
    margin: 20rpx auto 0rpx;
}

.u-img-box {
    width: 80rpx;
    height: 80rpx;
    border-radius: 50%;
    overflow: hidden;
}

.u-img-box image {
    width: 100%;
    height: 100%;
}

.u-company {
    overflow: hidden;
    box-sizing: border-box;
    padding: 0rpx 20rpx;
}

.u-company-name {
    font-size: 30rpx;
    color: #333333;
}

.u-company-address {
    color: #A0BDD4;
    font-size: 24rpx;
    width: 100%;
    display: flex;
}

.address-text {
    flex: 1;
}

.address-ellipsis {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.address-show {
    color: #28A1FF;
}

.u-button {
    width: 120rpx;
    height: 60rpx;
    background-color: #28A1FF;
    color: #fff;
    font-size: 24rpx;
    font-style: normal;
    line-height: 60rpx !important;
}

.flex-sub {
    flex: 1;
}

.u-position {
    font-size: 20rpx;
    color: #333333;
}
.caseimgbox{
    display: block;
    border-top: 1px solid #eaeaea;
    width: 100%;
    padding: 40rpx;
}
.everycaseimgbox{
    display: block;
    width: 670rpx;
    border: 1px solid #eaeaea;
    border-radius: 10rpx;
    margin-bottom: 40rpx;
    overflow: hidden;
}
.caseimg{
    display: block;
    width: 100%;
    height: auto;
}
.casetextbox{
    display: block;
    background-color: #fff;
    padding: 32rpx 40rpx;
}
/* 视频案例 */
.videocasebox{
    padding: 20rpx 30rpx;
    font-size: 36rpx;
}
.vidoetit{
    padding-left: 22rpx;
    line-height: 44rpx;
    position: relative;
    font-weight: bold;
}
.vidoetit::after{
    display: block;
    content: ' ';
    width: 8rpx;
    height: 30rpx;
    background: #333333;
    border-radius: 2rpx;
    position: absolute;
    left: 0;
    top: 7rpx;
}
.videoBox{
    display: block;
    width: 100%;
    height: 450rpx;
    background: #333333;
}
/* 案例详情 */
.casetit{
    display: block;
    width: 100%;
    padding: 20rpx 10rpx 0;
}
.casetit view{
    margin-right: 40rpx;
    padding-bottom: 10rpx;
}
.nowtitbox{
    font-size: 36rpx;
    font-weight: bold;
    position: relative;
}
.nowtitbox::before{
    content: ' ';
    display: block;
    width: 12rpx;
    height: 4rpx;
    position: absolute;
    bottom: 0;
    left: 50%;
    transform-origin: 100% 0;
    transform: translateX(-150%) rotate(-30deg);
    background-color: #333333;
}
.nowtitbox::after{
    content: ' ';
    display: block;
    width: 12rpx;
    height: 4rpx;
    position: absolute;
    bottom: 0;
    left: 50%;
    background-color: #333333;
    transform-origin: 0 0;
    transform: translateX(-50%) rotate(390deg);
}
.rightbtnbox{
    display: block;
    position: fixed;
    right: 0rpx;
    bottom:200rpx;
    z-index: 9;
}

.pricebtnimg{
    display: block;
    position: relative;
    right: 7rpx;
    width: 140rpx;
    height: 140rpx;
    z-index: 9;
    margin-bottom: 6rpx;
}
.tcollectbox{
    display: block;
    width: 98rpx;
	height: 98rpx;
	background-color: #ffffff;
	box-shadow: 0 2rpx 8rpx 0 rgba(56,72,85,0.20);
    border: solid 1px #B6CADE;
    border-radius: 50%;
    position: relative;
    right: -20rpx;
    overflow: hidden;
}
.tcollectbox image{
    display: block;
    width: 27rpx;
    height: 27rpx;
    margin: 18rpx auto 12rpx;
}
.tsharebox{
    background-color: #259cfa;
	box-shadow: 0px 2rpx 15rpx 1px 
		rgba(36, 157, 250, 0.48);
    border: solid 1px #249dfa;
    margin-bottom: 24rpx;
}

.switchTab {
    position: absolute;
    max-width: 80%;
    height: 56rpx;
    background-color: rgba(255, 255, 255, 0.6);
    color: #333333;
    z-index: 999;
    bottom: 20rpx;
    left: 50%;
    transform: translateX(-50%);
    border-radius: 28rpx;
    display: flex;
    align-items: center;
}

.switchTab>view {
    width: 130rpx;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 24rpx;
}

.activeTab {
    background-color: #249EFB;
    border-radius: 35rpx;
    color: #fff;
}
.interVrStyle {
    position: absolute;
    width: 90rpx !important;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
}
.configmsg image {
    display: block !important;
    border-radius: 0rpx !important;
    margin: 0rpx !important;
    padding: 0rpx !important;
}
/*--*/
.shareTips {
    width: 100%;
    height: 55rpx;
    background-color: #FDDAC4;
    color: #F96400;
    position: fixed;
    bottom: 100rpx;
    left: 0rpx;
    line-height: 55rpx;
    text-align: center;
    font-size: 24rpx;
}

.cutAndShare {
    width: 100%;
    height: 100rpx;
    position: fixed;
    bottom: 0rpx;
    left: 0rpx;
    background-color: #fff;
    box-shadow: 0rpx -10rpx 10rpx 6rpx rgba(0, 0, 0, 0.1);
    display: flex;
}

.shareCutImg {
    width: 40%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 32rpx;
}

.shareBtn {
    flex: 1;
    height: 100%;
    background-color: #F96400;
    border-radius: 0rpx !important;
    line-height: 100rpx;
    color: #fff;
    font-size: 32rpx;
}

.cutMask {
    width: 100%;
    height: 100vh;
    position: fixed;
    top: 0rpx;
    left: 0rpx;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 999999 !important;
}

.cutBlock {
    width: 100%;
    height: 70%;
    background-color: #fff;
    position: absolute;
    bottom: 0rpx;
    left: 0rpx;
    box-sizing: border-box;
    padding: 88rpx 0rpx 100rpx;
}

.cutTitle {
    width: 100%;
    height: 88rpx;
    background-color: #F96400;
    color: #fff;
    font-size: 32rpx;
    text-align: center;
    line-height: 88rpx;
    position: absolute;
    top: 0rpx;
    left: 0rpx;
}

.cutConfirm {
    width: 100%;
    height: 100rpx;
    background-color: #F96400;
    color: #fff;
    position: absolute;
    bottom: 0rpx;
    left: 0rpx;
    text-align: center;
    line-height: 100rpx;
    font-size: 32rpx;
    border-radius: 0rpx;
}

.cutContent {
    width: 100%;
    height: 100%;
    overflow: auto;
}

.cutShareLabel {
    width: 100%;
    height: 66rpx;
    line-height: 66rpx;
    box-sizing: border-box;
    padding: 0rpx 20rpx;
}

.cutImglistBox {
    width: 100%;
    height: auto;
    overflow: hidden;
    box-sizing: border-box;
    padding: 20rpx;
    display: flex;
    flex-wrap: wrap;
}

.uploadImg {
    width: 150rpx;
    height: 150rpx;
    border: 2rpx solid #D7DFE4;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.uploadImg>image {
    width: 50rpx;
}

.u-text {
    font-size: 28rpx;
    color: #B5C6D3;
}

.imageItem {
    width: 150rpx;
    height: 150rpx;
    background-color: #ccc;
    margin-right: 10rpx;
    margin-bottom: 10rpx;
    position: relative;
}

.imageItem>image {
    width: 100%;
    height: 100%;
}

.imgdel {
    width: 60rpx;
    height: 60rpx;
    background-color: rgba(0, 0, 0, 0.5);
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    box-shadow: 0rpx 0rpx 10rpx 10rpx rgba(0, 0, 0, 0.05);
}

.imgdel>image {
    width: 50rpx;
}

.u-textarea-box {
    width: 100%;
    height: 400rpx;
    box-sizing: border-box;
    padding: 20rpx;
}

.u-textarea {
    width: 100%;
    background-color: #F0F4F7;
    padding: 10rpx;
}

.shareApprovalbtn {
    width: 100%;
    height: 88rpx;
    background-color: #249EFB;
    color: #fff;
    font-size: 30rpx;
    text-align: center;
    line-height: 88rpx;
    position: fixed;
    bottom: 0rpx;
    left: 0rpx;
    z-index: 99;
}

.shareMask {
    width: 100%;
    height: 100vh;
    background-color: rgba(0, 0, 0, 0.4);
    position: fixed;
    top: 0rpx;
    left: 0rpx;
    z-index: 999;
}

.shareBlock {
    width: 100%;
    height: 75%;
    background-color: #fff;
    position: absolute;
    bottom: 0rpx;
    left: 0rpx;
    box-sizing: border-box;
    padding-top: 88rpx;
}

.shareBlockTitle {
    width: 100%;
    height: 88rpx;
    background-color: #249EFB;
    color: #fff;
    font-size: 30rpx;
    text-align: center;
    line-height: 88rpx;
    position: absolute;
    top: 0rpx;
    left: 0rpx;
}

.shareBlockContent {
    width: 100%;
    height: 100%;
    overflow: auto;
    box-sizing: border-box;
    padding: 20rpx;
}

.shareApprovalItem {
    width: 100%;
    height: auto;
    overflow: hidden;
    display: flex;
}

.shareApprovalLeft {
    width: 130rpx;
}

.shareApprovalLeft>image {
    width: 96rpx;
    height: 96rpx;
    border-radius: 50%;
    overflow: hidden;
}

.shareApprovalRight {
    flex: 1;
}

.shareApprovalText {
    width: 100%;
    height: 66rpx;
    line-height: 66rpx;
}

.shareApprovalText .satName {
    color: 30rpx;
    color: #333333;
}

.shareApprovalText .satTime {
    color: #A8BBCB;
    font-size: 26rpx;
    margin-left: 20rpx;
}

.shareApprovalImgBox {
    width: 100%;
    height: auto;
    overflow: hidden;
    display: flex;
    flex-wrap: wrap;
}

.shareApprovalImgItem {
    width: 180rpx;
    height: 150rpx;
    background-color: #ccc;
    margin-right: 10rpx;
    margin-bottom: 10rpx;
}

.shareApprovalImgItem > image {
    width: 100%;
    height: 100%;
}

.shareApprovalMsg {
    width: 100%;
    box-sizing: border-box;
    padding: 5rpx 0rpx 20rpx;
    font-size: 26rpx;
    color: #333333;
}
.shareApproValBtnBox {
    width: 100%;
    height: 88rpx;
    display: flex;
    align-items: center;
    justify-content: space-around;
}
.aConfirmBtn {
    width: 260rpx;
    height: 88rpx;
    line-height: 88rpx;
    border-radius: 44rpx;
    background-color: #249EFB;
    color: #fff;
    font-size: 30rpx;
}
.aRejectBtn {
    width: 260rpx;
    height: 88rpx;
    line-height: 88rpx;
    border-radius: 44rpx;
    background-color: #B5CADD;
    color: #fff;
    font-size: 30rpx;
}
.videoloading{
    display: block;
    width: 100%;
    height: 100%;
    z-index: 99;
    background-color: transparent;
    position: absolute;
    top: 0;
    left:0;
}