* { margin: 0; padding: 0; } html, body { background: white; font-size: 14px; } .membera { box-sizing: border-box; padding: 35px; overflow: hidden; display: flex; justify-content: space-between; align-items: center; } .membera_inner { width: 255px; height: 115px; border: 2px solid #dddddd; border-radius: 5px; display: flex; flex-direction: column; align-items: center; justify-content: center; } .membera_inner:hover { border-color: #ff9a4f; box-shadow: 0 0 5px #ff9a4f; } .membera_inner01 { font-size: 20px; color: #ea4b5a; width: 100%; text-align: center; } .membera_inner02 { display: flex; align-items: center; box-sizing: border-box; padding-top: 10px; } .membera_inner02>img { display: block; width: 30px; height: 30px; } .membera_inner02>p { text-indent: 10px; } .memberb { display: flex; justify-content: space-between; box-sizing: border-box; padding: 0 35px; color: #666; } .memberb_right { display: flex; align-items: center; } .memberb_right02 { margin: 0 10px; } .memberb_right02>input { display: block; width: 300px; height: 30px; border: 2px solid #dddddd; border-radius: 4px; box-sizing: border-box; padding: 0 10px; outline: none; } .memberb_right03 { height: 30px; line-height: 30px; background: #f97e81; border-radius: 4px; color: white; box-sizing: border-box; padding: 0 15px; cursor: pointer; } .memberb_right03:hover { opacity: 0.8; } .memberc { box-sizing: border-box; padding: 0 35px; } .memberd { display: none; box-sizing: border-box; padding: 20px 20px 10px 20px; } .memberd_inner>input { width: 100%; height: 35px; border: 1px solid gainsboro; border-radius: 4px; box-sizing: border-box; padding: 0 10px; } body .demo-class .layui-layer-btn .layui-layer-btn0 { background: #f97e81; color: white; border-color: #f97e81 ; }