.dialog{ width: 100%; height: 100%; position: fixed; left: 0; top: 0; right: 0; bottom: 0; background: rgba(0,0,0,0.4); z-index: 999; display: grid; place-items: center; } .dialog .dia-box{ padding: 65px; background: #fff; width: 800px; } .dialog .dia-box .dia-title{ display: flex; } .dialog .dia-box .dia-title div{ display: flex; flex: 1; justify-content: center; font-family: Microsoft YaHei; font-weight: 400; color: #333333; } .dialog .dia-box .dia-name{ margin-bottom: 24px; padding: 10px 50px; border: 1px solid #CCCCCC; } .dialog .dia-box .dia-name input{ width: 100%; border: none; outline: none; background: transparent; } .dialog .dia-box .dia-upload{ font-family: Microsoft YaHei; font-weight: 400; color: #999999; } .dialog .dia-box .dia-upload .document{ display: flex; position: relative; } .dialog .dia-box .dia-upload .document .disable{ flex: 1; border: 1px solid #CCCCCC; padding-left: 50px; } .dialog .dia-box .dia-upload .document .doc{ background: #0091BF; font-family: Microsoft YaHei; font-weight: 400; color: #FEFEFE; width: 80px; text-align: center; } .dialog .dia-box .dia-upload .document .file{ /* background: red; */ width: 80px; height: 47px; position: absolute; top: 10px; right: 0; opacity: 0; } .dialog .dia-box .dia-down{ display: flex; justify-content: space-between; } .dialog .dia-box .dia-down .moban{ font-family: Source Han Sans CN; font-weight: bold; color: #333333; } .dialog .dia-box .dia-down .download{ font-family: Source Han Sans CN; font-weight: bold; color: #0091BF; cursor: pointer; } .dialog .dia-box .dia-des p{ font-family: Microsoft YaHei; font-weight: 400; color: #999999; } .dialog .dia-box .dia-sub{ /* height: 64px; */ background: #0091BF; font-family: Microsoft YaHei; font-weight: 400; color: #FEFEFE; /* line-height: 64px; */ text-align: center; cursor: pointer; } @media all and (max-width:1279px) { } @media all and (max-width: 1024px) { .dialog .dia-box{ padding: 35px; width: 600px; } } @media all and (max-width: 768px) { .dialog .dia-box{ padding: 20px; width: 320px; border-radius: 10px; } .dialog .dia-box .dia-name{ padding: 10px 15px; } .dialog .dia-box .dia-upload .document .disable{ padding-left: 15px; } } @media all and (max-width: 640px) { .dialog .dia-box .dia-upload .document .file{ height: 36px; top: 6px; } }