.flex1 { display: flex; justify-content: space-between; flex-wrap: wrap; } .flex2 { display: flex; justify-content: left; justify-items: flex-end; flex-wrap: wrap; } .main .interviewee-content { margin: calc(10vmax / 12.80) calc(17vmax / 12.80); display: flex; justify-content: space-between; align-items: center; /*flex-wrap: wrap;*/ } .main .interviewee-content .tit-box { height: calc(46vmax / 12.80); line-height: calc(46vmax / 12.80); font-weight: 500; font-size: calc(28vmax / 12.80); color: #145676; display: inline-block; } .main .interviewee-content .interviewee-content-left, .main .interviewee-content .interviewee-content-right { background-color: #fff; /*overflow: hidden;*/ box-sizing: border-box; height: calc(650vmax / 12.80); } .main .interviewee-content .interviewee-content-left { width: calc(377vmax / 12.80); padding: calc(20vmax / 12.80) calc(24vmax / 12.80); } .main .interviewee-content .interviewee-content-right { width: calc(855vmax / 12.80); padding: calc(20vmax / 12.80) 0 calc(20vmax / 12.80) calc(24vmax / 12.80); position: relative; } .main .interviewee-content .interviewee-content-left .userInfo-box { margin-top: calc(42vmax / 12.80); display: flex; justify-content: space-between; } .main .interviewee-content .interviewee-content-left .userInfo-box .avatar { width: calc(100vmax / 12.80); height: calc(130vmax / 12.80); border-radius: calc(2vmax / 12.80); margin-right: calc(10vmax / 12.80); background: #B5D7E7; } .main .interviewee-content .interviewee-content-left .userInfo-box .info-box { width: calc(100% - 110vmax / 12.80); font-size: calc(22vmax / 12.80); color: #145676; } .main .interviewee-content .interviewee-content-left .userInfo-box .info-box > view { line-height: calc(40vmax / 12.80); height: calc(40vmax / 12.80); } .main .interviewee-content .interviewee-content-left .userInfo-box .info-box .userInfo-phone { display: flex; align-items: flex-end; justify-content: space-between; } .main .interviewee-content .interviewee-content-left .userInfo-box .info-box .userInfo-phone .phone-input { width: calc(100% - 32vmax / 12.80); height: calc(40vmax / 12.80); line-height: calc(40vmax / 12.80); border-bottom: calc(2vmax / 12.80) solid #B8EFF3; font-size: calc(22vmax / 12.80); color: #145676; vertical-align: middle; padding: 0; } .main .interviewee-content .interviewee-content-left .userInfo-box .info-box .userInfo-phone .phone-icon { width: calc(22vmax / 12.80); height: calc(32vmax / 12.80); } .main .interviewee-content .interviewee-content-left .remainingInfo-box { margin-top: calc(48vmax / 12.80); display: flex; justify-content: left; justify-items: flex-end; flex-wrap: wrap; } .main .interviewee-content .interviewee-content-left .remainingInfo-box .box-item { font-size: calc(22vmax / 12.80); color: #145676; margin-bottom: calc(22vmax / 12.80); width: calc(100%); position: relative; display: flex; } .main .interviewee-content .interviewee-content-left .remainingInfo-box .box-item > text { margin-right: calc(20vmax / 12.80); width: calc(50vmax / 12.80); height: calc(44vmax / 12.80); line-height: calc(44vmax / 12.80); } .main .interviewee-content .interviewee-content-left .remainingInfo-box .box-item .input, .main .interviewee-content .interviewee-content-left .remainingInfo-box .box-item .picker { width: calc(100% - 70vmax / 12.80); height: calc(44vmax / 12.80); line-height: calc(44vmax / 12.80); border: calc(1vmax / 12.80) solid #B8EFF3; box-shadow: 0 0 calc(8vmax / 12.80) 0 rgba(185,238,243,0.98); border-radius: calc(2vmax / 12.80); color: #09AECC; font-size: calc(22vmax / 12.80); padding-left: calc(15vmax / 12.80); box-sizing: border-box; } .main .interviewee-content .interviewee-content-left .remainingInfo-box .box-item .input-pl { color: #B5D7E7; } .main .interviewee-content .interviewee-content-left .select-area { max-height: calc(200vmax / 12.80); position: absolute; bottom: 0; left: calc(100% + 10vmax / 12.80); width: calc(100% - 70vmax / 12.80); background-color: #fff; padding: calc(6vmax / 12.80) calc(20vmax / 12.80); box-sizing: border-box; font-size: calc(18vmax / 12.80); color: #4489B9; z-index: 999; box-shadow: 0 0 calc(8vmax / 12.80) 0 rgba(115, 218, 228, 1); border-radius: calc(2vmax / 12.80); overflow-y: auto; } .main .interviewee-content .interviewee-content-left .select-area .item { padding: calc(10vmax / 12.80) 0; opacity: 0.7; text-align: center; border-bottom: calc(1vmax / 12.80) solid transparent; } .main .interviewee-content .interviewee-content-left .select-area .item:not(:last-child) { border-bottom: calc(1vmax / 12.80) solid #DFEDF7; } .main .interviewee-content .interviewee-content-right .manual-operation { background: #13B5B1; border-radius: calc(23vmax / 12.80); font-weight: 500; font-size: calc(22vmax / 12.80); color: #FFFFFF; width: calc(170vmax / 12.80); height: calc(46vmax / 12.80); line-height: calc(46vmax / 12.80); text-align: center; margin-left: calc(34vmax / 12.80); display: inline-block; } .main .interviewee-content .interviewee-content-right .right-floor { height: 100%; width: calc(76vmax / 12.80); position: absolute; top: calc(32vmax / 12.80); right: 0; } .main .interviewee-content .interviewee-content-right .right-floor .right-floor-item { width: calc(76vmax / 12.80); height: calc(40vmax / 12.80); line-height: calc(40vmax / 12.80); background: #FFF3E1; border-radius: calc(8vmax / 12.80) 0 0 calc(8vmax / 12.80); font-weight: bold; font-size: calc(20vmax / 12.80); color: #D6AB6A; text-align: center; margin-bottom: calc(12vmax / 12.80); } .main .interviewee-content .interviewee-content-right .search-content { width: calc(100% - 106vmax / 12.80); overflow: hidden; transition: max-height 0.4s linear; } .main .interviewee-content .interviewee-content-right .search-content-max { max-height: calc(200vmax / 12.80); } .main .interviewee-content .interviewee-content-right .search-content-min { max-height: 0; } .main .interviewee-content .interviewee-content-right .search-content .content-top { width: 100%; display: flex; justify-content: space-between; flex-wrap: wrap; } .main .interviewee-content .interviewee-content-right .search-content .search-item { width: calc(100% / 3 - 10vmax / 12.80); color: #145676; margin-bottom: calc(16vmax / 12.80); box-sizing: border-box; display: flex; justify-content: left; align-items: center; } .main .interviewee-content .interviewee-content-right .search-content .search-item > text { font-size: calc(20vmax / 12.80); height: calc(44vmax / 12.80); line-height: calc(44vmax / 12.80); padding-right: calc(8vmax / 12.80); padding-left: calc(8vmax / 12.80); box-sizing: border-box; } .main .interviewee-content .interviewee-content-right .search-content .search-item .search-input { font-size: calc(20vmax / 12.80); /*width: calc(100% - 80vmax / 12.80);*/ flex: 1; height: calc(44vmax / 12.80); line-height: calc(44vmax / 12.80); /*margin-left: 6rpx;*/ padding: 0 calc(8vmax / 12.80); box-sizing: border-box; color: #09AECC; } .main .interviewee-content .interviewee-content-right .search-content .search-item .search-input-placeholder { font-size: calc(20vmax / 12.80); color: #B5D7E7; } .main .interviewee-content .interviewee-content-right .search-content .search-btn { display: flex; justify-content: flex-end; margin-bottom: calc(20vmax / 12.80); } .main .interviewee-content .interviewee-content-right .search-content .search-btn .click-search, .main .interviewee-content .interviewee-content-right .search-content .search-btn .click-clear { width: calc(170vmax / 12.80); height: calc(46vmax / 12.80); line-height: calc(46vmax / 12.80); text-align: center; border-radius: calc(20vmax / 12.80); font-weight: 500; font-size: calc(22vmax / 12.80); } .main .interviewee-content .interviewee-content-right .search-content .search-btn .click-search { background: #146576; color: #FFFFFF; margin-right: calc(35vmax / 12.80); } .main .interviewee-content .interviewee-content-right .search-content .search-btn .click-clear { color: #146576; border: calc(1vmax / 12.80) solid #146576; } .main .interviewee-content .interviewee-content-right .input-shadow { box-shadow: 0 0 calc(4vmax / 12.80) 0 rgba(185,238,243,0.98); border-radius: calc(2vmax / 12.80); border: calc(1vmax / 12.80) solid #B8EFF3; } .main .interviewee-content .interviewee-content-right .floor-detail { margin-top: calc(10vmax / 12.80); overflow: hidden; transition: max-height 0.4s linear; width: calc(100% - 106vmax / 12.80); } .main .interviewee-content .interviewee-content-right .floor-detail .floor-detail-item { width: calc((100% - calc(72vmax / 12.80)) / 3); height: calc(84vmax / 12.80); background: #D1F4F7; border-radius: calc(12vmax / 12.80); font-size: calc(22vmax / 12.80); color: #145676; padding: calc(12vmax / 12.80); margin-bottom: calc(10vmax / 12.80); box-sizing: border-box; margin-left: calc(36vmax / 12.80); } .main .interviewee-content .interviewee-content-right .floor-detail .floor-detail-item > view { height: calc(30vmax / 12.80); line-height: calc(30vmax / 12.80); width: 100%; white-space:nowrap; overflow: hidden; text-overflow: ellipsis; } .main .interviewee-content .interviewee-content-right .floor-detail .floor-detail-item:nth-child(3n - 2) { margin-left: 0 !important; } .main .interviewee-content .interviewee-content-right .num-page { position: absolute; bottom: calc(15vmax / 12.80); } .main .interviewee-content .interviewee-content-right .num-page .previous, .main .interviewee-content .interviewee-content-right .num-page .next { width: calc(170vmax / 12.80); height: calc(40vmax / 12.80); line-height: calc(40vmax / 12.80); display: inline-block; background: #FFF3E1; border-radius: calc(20vmax / 12.80); font-weight: 500; font-size: calc(22vmax / 12.80); color: #D6AB6A; text-align: center; } .main .interviewee-content .interviewee-content-right .num-page .total { display: inline-block; font-weight: 500; font-size: calc(20vmax / 12.80); color: #D6AB6A; margin: 0 calc(20vmax / 12.80); } .main .interviewee-content .interviewee-content-right .enter { margin-top: calc(35vmax / 12.80); width: calc(100% - 24vmax / 12.80); } .main .interviewee-content .interviewee-content-right .enter .enter-item { font-size: calc(22vmax / 12.80); color: #145676; margin-bottom: calc(22vmax / 12.80); } .main .interviewee-content .interviewee-content-right .enter .enter-item > text { width: calc(80vmax / 12.80); margin-top: calc(10vmax / 12.80); } .main .interviewee-content .interviewee-content-right .enter .enter-item .enter-input { font-size: calc(22vmax / 12.80); height: calc(44vmax / 12.80); line-height: calc(44vmax / 12.80); width: calc(250vmax / 12.80); margin-left: calc(20vmax / 12.80); padding: 0 calc(15vmax / 12.80); color: #09AECC; white-space:nowrap; overflow: hidden; text-overflow: ellipsis; } .main .interviewee-content .interviewee-content-right .enter .enter-item .enter-input-placeholder { font-size: calc(22vmax / 12.80); color: #B5D7E7; } .main .interviewee-content .interviewee-content-right .enter-clear { width: calc(170vmax / 12.80); height: calc(40vmax / 12.80); line-height: calc(40vmax / 12.80); margin-top: calc(47vmax / 12.80); display: inline-block; background: #FFF3E1; border-radius: calc(20vmax / 12.80); font-weight: 500; font-size: calc(22vmax / 12.80); color: #D6AB6A; text-align: center; } .main .interviewee-content .interviewee-content-right .right-top { display: flex; justify-content: space-between; flex-wrap: wrap; width: calc(100% - 106vmax / 12.80); margin-bottom: calc(20vmax / 12.80); } .main .interviewee-content .interviewee-content-right .right-top .right-top-tit { width: 50%; height: calc(46vmax / 12.80); line-height: calc(46vmax / 12.80); } .main .interviewee-content .interviewee-content-right .right-top .right-top-screen { text-align: right; height: calc(46vmax / 12.80); line-height: calc(46vmax / 12.80); display: flex; justify-content: center; align-items: center; } .main .interviewee-content .interviewee-content-right .right-top .right-top-screen .floor { font-weight: bold; font-size: calc(20vmax / 12.80); color: #D6AB6A; height: calc(46vmax / 12.80); line-height: calc(46vmax / 12.80); display: inline-block; } .main .interviewee-content .interviewee-content-right .right-top .right-top-screen .screen { font-weight: bold; font-size: calc(22vmax / 12.80); color: #80c269; margin-left: calc(24vmax / 12.80); height: calc(46vmax / 12.80); line-height: calc(46vmax / 12.80); display: flex; justify-content: center; align-items: center; } .main .interviewee-content .interviewee-content-right .right-top .right-top-screen .hidden-icon { width: calc(28vmax / 12.80); height: calc(28vmax / 12.80); margin-left: calc(10vmax / 12.80); vertical-align: middle; } /* 键盘样式开始 */ /* 键盘 */ .main .interviewee-content .keyboard { position: fixed; width: calc(640vmax / 12.80); padding: 0 calc(15vmax / 12.80) calc(15vmax / 12.80) calc(15vmax / 12.80); /*height: calc(480vmax / 12.80);*/ bottom: calc(150vmax / 12.80); right: calc(180vmax / 12.80); z-index: 99; /*background-color: #fff;*/ border: 0 solid #B8EFF3; box-shadow: 0 0 calc(8vmax / 12.80) 0 rgba(115, 218, 228, 1); overflow: hidden; display: flex; flex-direction: column; justify-content: center; align-items: center; border-radius: calc(16vmax / 12.80); background: linear-gradient(180deg, #00E3C5 0%, #07D3E0 100%); } .main .interviewee-content .keyboard .keyboard-tit { color: rgba(20, 86, 118, 1); font-size: calc(28vmax / 12.80); font-weight: 700; height: calc(60vmax / 12.80); line-height: calc(60vmax / 12.80); } .main .interviewee-content .keyboard .keyboard-mini { background-color: #fff; padding: calc(15vmax / 12.80) 0; position: relative; /*height: calc(375vmax / 12.80);*/ display: flex; flex-direction: column; justify-content: center; align-items: center; border-radius: calc(16vmax / 12.80); } .main .interviewee-content .keyboard .keyboard-mini .provinces, .main .interviewee-content .keyboard .keyboard-mini .keyNums{ overflow: hidden; display: flex; flex-wrap: wrap; } .main .interviewee-content .keyboard .kb-btn-box { width: calc(295vmax / 12.80); display: flex; justify-content: space-between; align-items: center; } .main .interviewee-content .keyboard .kb-btn-box .kb-delete-btn { background: rgba(225, 69, 69, 1) !important; color: #fff; width: calc(140vmax / 12.80); height: calc(42vmax / 12.80); line-height: calc(42vmax / 12.80); border-radius: calc(24vmax / 12.80); font-size: calc(22vmax / 12.80); text-align: center; } .main .interviewee-content .keyboard .kb-btn-box .kb-sure-btn { background: #ccc; color: #fff; width: calc(140vmax / 12.80); height: calc(42vmax / 12.80); line-height: calc(42vmax / 12.80); border-radius: calc(24vmax / 12.80); font-size: calc(22vmax / 12.80); text-align: center; } .main .interviewee-content .keyboard .kb-btn-box .down-blue { background-color: rgba(24, 186, 255, 1) !important; color: #ffffff !important; } .main .interviewee-content .keyboard .keyboard-mini .pro-li { background: rgba(208, 244, 248, 1); color: #145676; width: calc(50vmax / 12.80); height: calc(60vmax / 12.80); line-height: calc(60vmax / 12.80); border-radius: calc(10vmax / 12.80); font-size: calc(22vmax / 12.80); text-align: center; margin: 0 calc(15vmax / 12.80) calc(15vmax / 12.80) calc(15vmax / 12.80); } /* 键盘样式结束 */ /* 多选楼层开始 */ .main .interviewee-content .floor-box { position: absolute; top: calc(120vmax / 12.80); left: 50%; transform: translateX(-50%); /*width: calc(880vmax / 12.80);*/ /*height: calc(470vmax / 12.80);*/ padding: 0 calc(20vmax / 12.80) calc(20vmax / 12.80) calc(20vmax / 12.80); background-color: #01e2c7; border-radius: calc(16vmax / 12.80); display: flex; flex-direction: column; justify-content: center; align-items: center; z-index: 999; } .main .interviewee-content .floor-box .floor-tit { position: relative; color: rgba(20, 86, 118, 1); font-size: calc(28vmax / 12.80); font-weight: 700; height: calc(60vmax / 12.80); line-height: calc(60vmax / 12.80); } .main .interviewee-content .floor-box .floor-content { display: flex; justify-content: space-between; align-items: center; width: calc(880vmax / 12.80); } .main .interviewee-content .floor-box .floor-content .box-content { position: relative; background-color: #fff; border-radius: calc(10vmax / 12.80); width: calc(640vmax / 12.80); height: calc(440vmax / 12.80); padding: calc(30vmax / 12.80); box-sizing: border-box; } .main .interviewee-content .floor-box .floor-content .box-content .floor-item { height: calc(310vmax / 12.80); overflow: hidden; overflow-y: auto; } .main .interviewee-content .floor-box .floor-content .box-content .floor-item .floor-item-box { font-size: calc(20vmax / 12.80); display: inline-block; background-color: #d0f4f8; color: rgba(20, 86, 118, 1); width: calc(130vmax / 12.80); height: calc(56vmax / 12.80); line-height: calc(56vmax / 12.80); text-align: center; border-radius: calc(8vmax / 12.80); margin-bottom: calc(10vmax / 12.80); margin-right: calc(20vmax / 12.80); } .main .interviewee-content .floor-box .floor-content .box-content .floor-item .floor-item-box:nth-child(4n) { margin-right: 0; } .main .interviewee-content .floor-box .floor-content .box-content .floor-item .choose-floor-item { background-color: #13a1b4; color: #fff; } .main .interviewee-content .floor-box .floor-content .box-content .floor-btn { position: absolute; left: 50%; width: calc(330vmax / 12.80); padding: calc(20vmax / 12.80) 0; margin-top: calc(10vmax / 12.80); transform: translateX(-50%); display: flex; justify-content: space-between; align-items: center; } .main .interviewee-content .floor-box .floor-content .box-content .floor-btn .floor-btn-css { display: inline-block; font-size: calc(20vmax / 12.80); border-radius: calc(24vmax / 12.80); width: calc(140vmax / 12.80); height: calc(42vmax / 12.80); line-height: calc(42vmax / 12.80); text-align: center; } .main .interviewee-content .floor-box .floor-content .box-content .floor-btn .floor-cancel { background-color: #b1e3ff; color: rgba(21, 140, 207, 1); } .main .interviewee-content .floor-box .floor-content .box-content .floor-btn .floor-sure { background-color: #18baff; color: rgba(255, 255, 255, 1); } .main .interviewee-content .floor-box .floor-content .selected-floor { position: relative; background-color: #fff; border-radius: calc(10vmax / 12.80); width: calc(220vmax / 12.80); height: calc(440vmax / 12.80); overflow-y: auto; padding: calc(30vmax / 12.80) calc(20vmax / 12.80); box-sizing: border-box; } .main .interviewee-content .floor-box .floor-content .selected-floor .selected-floor-item { background-color: #13a2b5; color: #fff; width: calc(80vmax / 12.80); height: calc(32vmax / 12.80); line-height: calc(32vmax / 12.80); /* text-align: center; */ border-radius: calc(24vmax / 12.80); margin-bottom: calc(12vmax / 12.80); font-size: calc(16vmax / 12.80); position: relative; padding-left: calc(20vmax / 12.80); box-sizing: border-box; display: inline-block; } .main .interviewee-content .floor-box .floor-content .selected-floor .selected-floor-item:nth-child(2n - 1) { margin-right: calc(20vmax / 12.80); } .main .interviewee-content .floor-box .floor-content .selected-floor .delete-icon { position: absolute; top: calc(10vmax / 12.80); right: calc(12vmax / 12.80); width: calc(12vmax / 12.80); height: calc(12vmax / 12.80); } /*竖屏样式*/ .portrait-main .interviewee-content { margin: calc(10vmin / 12.80) calc(17vmin / 12.80); display: flex; justify-content: space-between; align-items: center; /*flex-wrap: wrap;*/ } .portrait-main .interviewee-content .tit-box { height: calc(46vmin / 12.80); line-height: calc(46vmin / 12.80); font-weight: 500; font-size: calc(28vmin / 12.80); color: #145676; display: inline-block; } .portrait-main .interviewee-content .interviewee-content-left, .portrait-main .interviewee-content .interviewee-content-right { background-color: #fff; /*overflow: hidden;*/ box-sizing: border-box; height: calc(650vmin / 12.80); } .portrait-main .interviewee-content .interviewee-content-left { width: calc(377vmin / 12.80); padding: calc(20vmin / 12.80) calc(24vmin / 12.80); } .portrait-main .interviewee-content .interviewee-content-right { width: calc(855vmin / 12.80); padding: calc(20vmin / 12.80) 0 calc(20vmin / 12.80) calc(24vmin / 12.80); position: relative; } .portrait-main .interviewee-content .interviewee-content-left .userInfo-box { margin-top: calc(42vmin / 12.80); display: flex; justify-content: space-between; } .portrait-main .interviewee-content .interviewee-content-left .userInfo-box .avatar { width: calc(100vmin / 12.80); height: calc(130vmin / 12.80); border-radius: calc(2vmin / 12.80); margin-right: calc(10vmin / 12.80); background: #B5D7E7; } .portrait-main .interviewee-content .interviewee-content-left .userInfo-box .info-box { width: calc(100% - 110vmin / 12.80); font-size: calc(22vmin / 12.80); color: #145676; } .portrait-main .interviewee-content .interviewee-content-left .userInfo-box .info-box > view { line-height: calc(40vmin / 12.80); height: calc(40vmin / 12.80); } .portrait-main .interviewee-content .interviewee-content-left .userInfo-box .info-box .userInfo-phone { display: flex; align-items: flex-end; justify-content: space-between; } .portrait-main .interviewee-content .interviewee-content-left .userInfo-box .info-box .userInfo-phone .phone-input { width: calc(100% - 32vmin / 12.80); height: calc(40vmin / 12.80); line-height: calc(40vmin / 12.80); border-bottom: calc(2vmin / 12.80) solid #B8EFF3; font-size: calc(22vmin / 12.80); color: #145676; vertical-align: middle; padding: 0; } .portrait-main .interviewee-content .interviewee-content-left .userInfo-box .info-box .userInfo-phone .phone-icon { width: calc(22vmin / 12.80); height: calc(32vmin / 12.80); } .portrait-main .interviewee-content .interviewee-content-left .remainingInfo-box { margin-top: calc(48vmin / 12.80); display: flex; justify-content: left; justify-items: flex-end; flex-wrap: wrap; } .portrait-main .interviewee-content .interviewee-content-left .remainingInfo-box .box-item { font-size: calc(22vmin / 12.80); color: #145676; margin-bottom: calc(22vmin / 12.80); width: calc(100%); position: relative; display: flex; } .portrait-main .interviewee-content .interviewee-content-left .remainingInfo-box .box-item > text { margin-right: calc(20vmin / 12.80); width: calc(50vmin / 12.80); height: calc(44vmin / 12.80); line-height: calc(44vmin / 12.80); } .portrait-main .interviewee-content .interviewee-content-left .remainingInfo-box .box-item .input, .portrait-main .interviewee-content .interviewee-content-left .remainingInfo-box .box-item .picker { width: calc(100% - 70vmin / 12.80); height: calc(44vmin / 12.80); line-height: calc(44vmin / 12.80); border: calc(1vmin / 12.80) solid #B8EFF3; box-shadow: 0 0 calc(8vmin / 12.80) 0 rgba(185,238,243,0.98); border-radius: calc(2vmin / 12.80); color: #09AECC; font-size: calc(22vmin / 12.80); padding-left: calc(15vmin / 12.80); box-sizing: border-box; } .portrait-main .interviewee-content .interviewee-content-left .remainingInfo-box .box-item .input-pl { color: #B5D7E7; } .portrait-main .interviewee-content .interviewee-content-left .select-area { max-height: calc(200vmin / 12.80); position: absolute; bottom: 0; left: calc(100% + 10vmax / 12.80); /*bottom: calc(58vmin / 12.80);*/ /*right: 0;*/ width: calc(100% - 70vmin / 12.80); background-color: #fff; padding: calc(6vmin / 12.80) calc(20vmin / 12.80); box-sizing: border-box; font-size: calc(18vmin / 12.80); color: #4489B9; z-index: 999; box-shadow: 0 0 calc(8vmin / 12.80) 0 rgba(115, 218, 228, 1); border-radius: calc(2vmin / 12.80); overflow-y: auto; } .portrait-main .interviewee-content .interviewee-content-left .select-area .item { padding: calc(10vmax / 12.80) 0; opacity: 0.7; text-align: center; border-bottom: calc(1vmin / 12.80) solid transparent; } .portrait-main .interviewee-content .interviewee-content-left .select-area .item:not(:last-child) { border-bottom: calc(1vmin / 12.80) solid #DFEDF7; } .portrait-main .interviewee-content .interviewee-content-right .manual-operation { background: #13B5B1; border-radius: calc(23vmin / 12.80); font-weight: 500; font-size: calc(22vmin / 12.80); color: #FFFFFF; width: calc(170vmin / 12.80); height: calc(46vmin / 12.80); line-height: calc(46vmin / 12.80); text-align: center; margin-left: calc(34vmin / 12.80); display: inline-block; } .portrait-main .interviewee-content .interviewee-content-right .right-floor { height: 100%; width: calc(76vmin / 12.80); position: absolute; top: calc(32vmin / 12.80); right: 0; } .portrait-main .interviewee-content .interviewee-content-right .right-floor .right-floor-item { width: calc(76vmin / 12.80); height: calc(40vmin / 12.80); line-height: calc(40vmin / 12.80); background: #FFF3E1; border-radius: calc(8vmin / 12.80) 0 0 calc(8vmin / 12.80); font-weight: bold; font-size: calc(20vmin / 12.80); color: #D6AB6A; text-align: center; margin-bottom: calc(12vmin / 12.80); } .portrait-main .interviewee-content .interviewee-content-right .search-content { width: calc(100% - 106vmin / 12.80); overflow: hidden; transition: max-height 0.4s linear; } .portrait-main .interviewee-content .interviewee-content-right .search-content-max { max-height: calc(200vmax / 12.80); } .portrait-main .interviewee-content .interviewee-content-right .search-content-min { max-height: 0; } .portrait-main .interviewee-content .interviewee-content-right .search-content .content-top { width: 100%; display: flex; justify-content: space-between; flex-wrap: wrap; } .portrait-main .interviewee-content .interviewee-content-right .search-content .search-item { width: calc(100% / 3 - 10vmin / 12.80); color: #145676; margin-bottom: calc(16vmin / 12.80); box-sizing: border-box; display: flex; justify-content: left; align-items: center; } .portrait-main .interviewee-content .interviewee-content-right .search-content .search-item > text { font-size: calc(20vmin / 12.80); height: calc(44vmin / 12.80); line-height: calc(44vmin / 12.80); padding-right: calc(8vmin / 12.80); padding-left: calc(8vmin / 12.80); box-sizing: border-box; } .portrait-main .interviewee-content .interviewee-content-right .search-content .search-item .search-input { font-size: calc(20vmin / 12.80); /*width: calc(100% - 80vmin / 12.80);*/ flex: 1; height: calc(44vmin / 12.80); line-height: calc(44vmin / 12.80); /*margin-left: 6rpx;*/ padding: 0 calc(8vmin / 12.80); box-sizing: border-box; color: #09AECC; } .portrait-main .interviewee-content .interviewee-content-right .search-content .search-item .search-input-placeholder { font-size: calc(20vmin / 12.80); color: #B5D7E7; } .portrait-main .interviewee-content .interviewee-content-right .search-content .search-btn { display: flex; justify-content: flex-end; margin-bottom: calc(20vmin / 12.80); } .portrait-main .interviewee-content .interviewee-content-right .search-content .search-btn .click-search, .portrait-main .interviewee-content .interviewee-content-right .search-content .search-btn .click-clear { width: calc(170vmin / 12.80); height: calc(46vmin / 12.80); line-height: calc(46vmin / 12.80); text-align: center; border-radius: calc(20vmin / 12.80); font-weight: 500; font-size: calc(22vmin / 12.80); } .portrait-main .interviewee-content .interviewee-content-right .search-content .search-btn .click-search { background: #146576; color: #FFFFFF; margin-right: calc(35vmin / 12.80); } .portrait-main .interviewee-content .interviewee-content-right .search-content .search-btn .click-clear { color: #146576; border: calc(1vmin / 12.80) solid #146576; } .portrait-main .interviewee-content .interviewee-content-right .input-shadow { box-shadow: 0 0 calc(4vmin / 12.80) 0 rgba(185,238,243,0.98); border-radius: calc(2vmin / 12.80); border: calc(1vmin / 12.80) solid #B8EFF3; } .portrait-main .interviewee-content .interviewee-content-right .floor-detail { margin-top: calc(10vmin / 12.80); overflow: hidden; transition: max-height 0.4s linear; width: calc(100% - 106vmin / 12.80); } .portrait-main .interviewee-content .interviewee-content-right .floor-detail .floor-detail-item { width: calc((100% - calc(72vmin / 12.80)) / 3); height: calc(84vmin / 12.80); background: #D1F4F7; border-radius: calc(12vmin / 12.80); font-size: calc(22vmin / 12.80); color: #145676; padding: calc(12vmin / 12.80); margin-bottom: calc(10vmin / 12.80); box-sizing: border-box; margin-left: calc(36vmin / 12.80); } .portrait-main .interviewee-content .interviewee-content-right .floor-detail .floor-detail-item > view { height: calc(30vmin / 12.80); line-height: calc(30vmin / 12.80); width: 100%; white-space:nowrap; overflow: hidden; text-overflow: ellipsis; } .portrait-main .interviewee-content .interviewee-content-right .floor-detail .floor-detail-item:nth-child(3n - 2) { margin-left: 0 !important; } .portrait-main .interviewee-content .interviewee-content-right .num-page { position: absolute; bottom: calc(15vmin / 12.80); } .portrait-main .interviewee-content .interviewee-content-right .num-page .previous, .portrait-main .interviewee-content .interviewee-content-right .num-page .next { width: calc(170vmin / 12.80); height: calc(40vmin / 12.80); line-height: calc(40vmin / 12.80); display: inline-block; background: #FFF3E1; border-radius: calc(20vmin / 12.80); font-weight: 500; font-size: calc(22vmin / 12.80); color: #D6AB6A; text-align: center; } .portrait-main .interviewee-content .interviewee-content-right .num-page .total { display: inline-block; font-weight: 500; font-size: calc(20vmin / 12.80); color: #D6AB6A; margin: 0 calc(20vmin / 12.80); } .portrait-main .interviewee-content .interviewee-content-right .enter { margin-top: calc(35vmin / 12.80); width: calc(100% - 24vmin / 12.80); } .portrait-main .interviewee-content .interviewee-content-right .enter .enter-item { font-size: calc(22vmin / 12.80); color: #145676; margin-bottom: calc(22vmin / 12.80); } .portrait-main .interviewee-content .interviewee-content-right .enter .enter-item > text { width: calc(80vmin / 12.80); margin-top: calc(10vmin / 12.80); } .portrait-main .interviewee-content .interviewee-content-right .enter .enter-item .enter-input { font-size: calc(22vmin / 12.80); height: calc(44vmin / 12.80); line-height: calc(44vmin / 12.80); width: calc(250vmin / 12.80); margin-left: calc(20vmin / 12.80); padding: 0 calc(15vmin / 12.80); color: #09AECC; white-space:nowrap; overflow: hidden; text-overflow: ellipsis; } .portrait-main .interviewee-content .interviewee-content-right .enter .enter-item .enter-input-placeholder { font-size: calc(22vmin / 12.80); color: #B5D7E7; } .portrait-main .interviewee-content .interviewee-content-right .enter-clear { width: calc(170vmin / 12.80); height: calc(40vmin / 12.80); line-height: calc(40vmin / 12.80); margin-top: calc(47vmin / 12.80); display: inline-block; background: #FFF3E1; border-radius: calc(20vmin / 12.80); font-weight: 500; font-size: calc(22vmin / 12.80); color: #D6AB6A; text-align: center; } .portrait-main .interviewee-content .interviewee-content-right .right-top { display: flex; justify-content: space-between; flex-wrap: wrap; width: calc(100% - 106vmin / 12.80); margin-bottom: calc(20vmin / 12.80); } .portrait-main .interviewee-content .interviewee-content-right .right-top .right-top-tit { width: 50%; height: calc(46vmin / 12.80); line-height: calc(46vmin / 12.80); } .portrait-main .interviewee-content .interviewee-content-right .right-top .right-top-screen { text-align: right; height: calc(46vmin / 12.80); line-height: calc(46vmin / 12.80); display: flex; justify-content: center; align-items: center; } .portrait-main .interviewee-content .interviewee-content-right .right-top .right-top-screen .floor { font-weight: bold; font-size: calc(20vmin / 12.80); color: #D6AB6A; height: calc(46vmin / 12.80); line-height: calc(46vmin / 12.80); display: inline-block; } .portrait-main .interviewee-content .interviewee-content-right .right-top .right-top-screen .screen { font-weight: bold; font-size: calc(22vmin / 12.80); color: #80c269; margin-left: calc(24vmin / 12.80); height: calc(46vmin / 12.80); line-height: calc(46vmin / 12.80); display: flex; justify-content: center; align-items: center; } .portrait-main .interviewee-content .interviewee-content-right .right-top .right-top-screen .hidden-icon { width: calc(28vmin / 12.80); height: calc(28vmin / 12.80); margin-left: calc(10vmin / 12.80); vertical-align: middle; } /* 键盘样式开始 */ /* 键盘 */ .portrait-main .interviewee-content .keyboard { position: fixed; width: calc(640vmin / 12.80); padding: 0 calc(15vmin / 12.80) calc(15vmin / 12.80) calc(15vmin / 12.80); /*height: calc(480vmin / 12.80);*/ bottom: calc(150vmin / 12.80); right: calc(180vmin / 12.80); z-index: 99; /*background-color: #fff;*/ border: 0 solid #B8EFF3; box-shadow: 0 0 calc(8vmin / 12.80) 0 rgba(115, 218, 228, 1); overflow: hidden; display: flex; flex-direction: column; justify-content: center; align-items: center; border-radius: calc(16vmin / 12.80); background: linear-gradient(180deg, #00E3C5 0%, #07D3E0 100%); } .portrait-main .interviewee-content .keyboard .keyboard-tit { color: rgba(20, 86, 118, 1); font-size: calc(28vmin / 12.80); font-weight: 700; height: calc(60vmin / 12.80); line-height: calc(60vmin / 12.80); } .portrait-main .interviewee-content .keyboard .keyboard-mini { background-color: #fff; padding: calc(15vmin / 12.80) 0; position: relative; /*height: calc(375vmin / 12.80);*/ display: flex; flex-direction: column; justify-content: center; align-items: center; border-radius: calc(16vmin / 12.80); } .portrait-main .interviewee-content .keyboard .keyboard-mini .provinces, .portrait-main .interviewee-content .keyboard .keyboard-mini .keyNums{ overflow: hidden; display: flex; flex-wrap: wrap; } .portrait-main .interviewee-content .keyboard .kb-btn-box { width: calc(295vmin / 12.80); display: flex; justify-content: space-between; align-items: center; } .portrait-main .interviewee-content .keyboard .kb-btn-box .kb-delete-btn { background: rgba(225, 69, 69, 1) !important; color: #fff; width: calc(140vmin / 12.80); height: calc(42vmin / 12.80); line-height: calc(42vmin / 12.80); border-radius: calc(24vmin / 12.80); font-size: calc(22vmin / 12.80); text-align: center; } .portrait-main .interviewee-content .keyboard .kb-btn-box .kb-sure-btn { background: #ccc; color: #fff; width: calc(140vmin / 12.80); height: calc(42vmin / 12.80); line-height: calc(42vmin / 12.80); border-radius: calc(24vmin / 12.80); font-size: calc(22vmin / 12.80); text-align: center; } .portrait-main .interviewee-content .keyboard .kb-btn-box .down-blue { background-color: rgba(24, 186, 255, 1) !important; color: #ffffff !important; } .portrait-main .interviewee-content .keyboard .keyboard-mini .pro-li { background: rgba(208, 244, 248, 1); color: #145676; width: calc(50vmin / 12.80); height: calc(60vmin / 12.80); line-height: calc(60vmin / 12.80); border-radius: calc(10vmin / 12.80); font-size: calc(22vmin / 12.80); text-align: center; margin: 0 calc(15vmin / 12.80) calc(15vmin / 12.80) calc(15vmin / 12.80); } /* 键盘样式结束 */ /* 多选楼层开始 */ .portrait-main .interviewee-content .floor-box { position: absolute; top: calc(120vmin / 12.80); left: 50%; transform: translateX(-50%); /*width: calc(880vmin / 12.80);*/ /*height: calc(470vmin / 12.80);*/ padding: 0 calc(20vmin / 12.80) calc(20vmin / 12.80) calc(20vmin / 12.80); background-color: #01e2c7; border-radius: calc(16vmin / 12.80); display: flex; flex-direction: column; justify-content: center; align-items: center; z-index: 999; } .portrait-main .interviewee-content .floor-box .floor-tit { position: relative; color: rgba(20, 86, 118, 1); font-size: calc(28vmin / 12.80); font-weight: 700; height: calc(60vmin / 12.80); line-height: calc(60vmin / 12.80); } .portrait-main .interviewee-content .floor-box .floor-content { display: flex; justify-content: space-between; align-items: center; width: calc(880vmin / 12.80); } .portrait-main .interviewee-content .floor-box .floor-content .box-content { position: relative; background-color: #fff; border-radius: calc(10vmin / 12.80); width: calc(640vmin / 12.80); height: calc(440vmin / 12.80); padding: calc(30vmin / 12.80); box-sizing: border-box; } .portrait-main .interviewee-content .floor-box .floor-content .box-content .floor-item { height: calc(310vmin / 12.80); overflow: hidden; overflow-y: auto; } .portrait-main .interviewee-content .floor-box .floor-content .box-content .floor-item .floor-item-box { font-size: calc(20vmin / 12.80); display: inline-block; background-color: #d0f4f8; color: rgba(20, 86, 118, 1); width: calc(130vmin / 12.80); height: calc(56vmin / 12.80); line-height: calc(56vmin / 12.80); text-align: center; border-radius: calc(8vmin / 12.80); margin-bottom: calc(10vmin / 12.80); margin-right: calc(20vmin / 12.80); } .portrait-main .interviewee-content .floor-box .floor-content .box-content .floor-item .floor-item-box:nth-child(4n) { margin-right: 0; } .portrait-main .interviewee-content .floor-box .floor-content .box-content .floor-item .choose-floor-item { background-color: #13a1b4; color: #fff; } .portrait-main .interviewee-content .floor-box .floor-content .box-content .floor-btn { position: absolute; left: 50%; width: calc(330vmin / 12.80); padding: calc(20vmin / 12.80) 0; margin-top: calc(10vmin / 12.80); transform: translateX(-50%); display: flex; justify-content: space-between; align-items: center; } .portrait-main .interviewee-content .floor-box .floor-content .box-content .floor-btn .floor-btn-css { display: inline-block; font-size: calc(20vmin / 12.80); border-radius: calc(24vmin / 12.80); width: calc(140vmin / 12.80); height: calc(42vmin / 12.80); line-height: calc(42vmin / 12.80); text-align: center; } .portrait-main .interviewee-content .floor-box .floor-content .box-content .floor-btn .floor-cancel { background-color: #b1e3ff; color: rgba(21, 140, 207, 1); } .portrait-main .interviewee-content .floor-box .floor-content .box-content .floor-btn .floor-sure { background-color: #18baff; color: rgba(255, 255, 255, 1); } .portrait-main .interviewee-content .floor-box .floor-content .selected-floor { position: relative; background-color: #fff; border-radius: calc(10vmin / 12.80); width: calc(220vmin / 12.80); height: calc(440vmin / 12.80); overflow-y: auto; padding: calc(30vmin / 12.80) calc(20vmin / 12.80); box-sizing: border-box; } .portrait-main .interviewee-content .floor-box .floor-content .selected-floor .selected-floor-item { background-color: #13a2b5; color: #fff; width: calc(80vmin / 12.80); height: calc(32vmin / 12.80); line-height: calc(32vmin / 12.80); /* text-align: center; */ border-radius: calc(24vmin / 12.80); margin-bottom: calc(12vmin / 12.80); font-size: calc(16vmin / 12.80); position: relative; padding-left: calc(20vmin / 12.80); box-sizing: border-box; display: inline-block; } .portrait-main .interviewee-content .floor-box .floor-content .selected-floor .selected-floor-item:nth-child(2n - 1) { margin-right: calc(20vmin / 12.80); } .portrait-main .interviewee-content .floor-box .floor-content .selected-floor .delete-icon { position: absolute; top: calc(10vmin / 12.80); right: calc(12vmin / 12.80); width: calc(12vmin / 12.80); height: calc(12vmin / 12.80); }