.page-protocal{ background: #f7f7f7; width:100vw; min-height: 100vh; display: flex; .logs{ display:flex; flex-direction: row; justify-content: center; align-items: center; width:100%; height:100px; margin-top:60px; .and-home{ display: flex; .img{ height:50px; } } .log{ display: flex; margin-left:10px; .img{ height:50px; } } } .protocal-content{ background:#FFF; min-height:360px; width:90%; margin:auto; border-top-right-radius: 20px; border-top-left-radius: 20px; box-shadow: 0px 0px 20px #5a5a5a; .title{ font-size: 18px; font-weight: bold; width:100%; height:50px; display:flex; justify-content: center; align-items: center; } .content{ margin-left:20px; margin-right: 20px; font-size:14px; line-height: 25px; height:300px; .pro{ margin-bottom: 10px; font-size:12px; height:310px; overflow: hidden; overflow-y:auto; .red{ color:#b21c1c; } } } .btns{ width:100%; height:50px; margin-top:20px; display: flex; flex-direction: row; justify-content: space-between; align-items: center; .btn{ width:50%; display:flex; justify-content: center; align-items: center; font-size:14px; .btn-disagree{ width:60%; font-size:14px; border-radius: 5px; } .btn-agree{ width:60%; font-size:14px; border-radius: 5px; background:#eeeeee; color:#FFF; } .btn-agree1{ width:60%; font-size:14px; border-radius: 5px; background:#b21c1c; color:#FFF; } } } } }