.main .timeoutDuration-content { display: flex; flex-wrap: wrap; margin: calc(40vmax / 12.80) calc(100vmax / 12.80); } .main .timeoutDuration-content .form-box { position: relative; display: flex; align-items: center; justify-content: left; width: 50%; font-size: calc(20vmax / 12.80); color: #063D8C; margin-bottom: calc(10vmax / 12.80); line-height: calc(48vmax / 12.80); min-height: calc(48vmax / 12.80); } .main .timeoutDuration-content .form-box>text { width: calc(230vmax / 12.80); margin-right: calc(20vmax / 12.80); line-height: calc(30vmax / 12.80); } .main .timeoutDuration-content .form-box .form-input { width: calc(100% - (250vmax / 12.80) - (85vmax / 12.80)); height: calc(48vmax / 12.80); background: #fff; /*border-radius: calc(8vmax / 12.80);*/ font-size: calc(18vmax / 12.80); color: #00A2FF; padding: 0 calc(20vmax / 12.80); box-sizing: border-box; border: 0 solid #B8EFF3; box-shadow: 0 0 calc(8vmax / 12.80) 0 rgba(115, 218, 228, 1); } .main .timeoutDuration-content .form-box .number-input { width: calc(140vmax / 12.80) !important; text-align: center !important; } .main .timeoutDuration-content .form-box .left, .main .timeoutDuration-content .form-box .right { height: calc(48vmax / 12.80); width: calc(42vmax / 12.80); background-color: #f1fafb; color: #78c2f9; text-align: center; line-height: calc(48vmax / 12.80); font-size: calc(17vmax / 12.80); font-weight: bold; /*border-radius: calc(8vmax / 12.80);*/ } .main .timeoutDuration-content .form-box .left { border-radius: calc(8vmax / 12.80) 0 0 calc(8vmax / 12.80); margin-right: calc(4vmax / 12.80); font-size: calc(20vmax / 12.80); } .main .timeoutDuration-content .form-box .right { border-radius: 0 calc(8vmax / 12.80) calc(8vmax / 12.80) 0; margin-left: calc(4vmax / 12.80); } /* 竖屏样式 */ .portrait-main .timeoutDuration-content { display: flex; flex-wrap: wrap; margin: calc(40vmin / 12.80) calc(100vmin / 12.80); } .portrait-main .timeoutDuration-content .form-box { position: relative; display: flex; align-items: center; justify-content: left; width: 50%; font-size: calc(20vmin / 12.80); color: #063D8C; margin-bottom: calc(10vmin / 12.80); line-height: calc(48vmin / 12.80); min-height: calc(48vmin / 12.80); } .portrait-main .timeoutDuration-content .form-box>text { width: calc(230vmin / 12.80); margin-right: calc(20vmin / 12.80); line-height: calc(30vmin / 12.80); } .portrait-main .timeoutDuration-content .form-box .form-input { width: calc(100% - (250vmin / 12.80) - (85vmin / 12.80)); height: calc(48vmin / 12.80); background: #fff; /*border-radius: calc(8vmin / 12.80);*/ font-size: calc(18vmin / 12.80); color: #00A2FF; padding: 0 calc(20vmin / 12.80); box-sizing: border-box; border: 0 solid #B8EFF3; box-shadow: 0 0 calc(8vmin / 12.80) 0 rgba(115, 218, 228, 1); } .portrait-main .timeoutDuration-content .form-box .number-input { width: calc(140vmin / 12.80) !important; text-align: center !important; } .portrait-main .timeoutDuration-content .form-box .left, .portrait-main .timeoutDuration-content .form-box .right { height: calc(48vmin / 12.80); width: calc(42vmin / 12.80); background-color: #f1fafb; color: #78c2f9; text-align: center; line-height: calc(48vmin / 12.80); font-size: calc(17vmin / 12.80); font-weight: bold; /*border-radius: calc(8vmin / 12.80);*/ } .portrait-main .timeoutDuration-content .form-box .left { border-radius: calc(8vmin / 12.80) 0 0 calc(8vmin / 12.80); margin-right: calc(4vmin / 12.80); font-size: calc(20vmin / 12.80); } .portrait-main .timeoutDuration-content .form-box .right { border-radius: 0 calc(8vmin / 12.80) calc(8vmin / 12.80) 0; margin-left: calc(4vmin / 12.80); }