* {margin:0; padding:0; box-sizing:border-box;}
body {background:#f8f8f8; font-family:Arial,sans-serif; color:#333; line-height:1.6; overflow-x:hidden;}
input, textarea, select {font-size:16px;}
@media screen and (-webkit-min-device-pixel-ratio:0) {
  select:focus, textarea:focus, input:focus {font-size:16px;}
}
#container {padding-top:24px; max-width:100%; margin:0 auto;}

.loginTit {width:100%; max-width:980px; height:65px; margin:0 auto 20px; 
  background:url(../image/login/udcms_logo.gif) no-repeat left center; background-size:auto 100%; 
  position:relative; display:flex; align-items:center;}
.lt_cont {height:40px; margin-left:260px; font-family:'黑体'; font-size:24px; 
  font-weight:bold; padding-left:22px; padding-top:15px; border-left:#c0c0c0 1px solid;}
#loginmain {width:100%; max-width:1000px; margin:0 auto; padding:0 15px;}
.box_mid {width:auto; background:#fff; border:8px solid #e7e7e7; border-radius:10px; 
  display:flex; flex-wrap:wrap; margin:0 auto 55px; max-width:900px;}
.box_l {flex:1; min-width:300px; height:320px; display:flex; flex-direction:column; 
  justify-content:flex-end; text-align:center; font:bold 22px '黑体'; color:#606060; 
  background:url(../image/login/udcms_ad.jpg) no-repeat center/cover; position:relative;}
.box_l a {display:block; position:relative; z-index:2; margin-bottom:15px; 
  text-shadow:0 0 5px rgba(0,0,0,0.5), 0 0 10px rgba(255,255,255,0.8); 
  background:rgba(255,255,255,0.85); padding:8px 15px; border-radius:8px; 
  margin:15px; box-shadow:0 2px 10px rgba(0,0,0,0.15); text-decoration:none; color:#333;}
.box_r {flex:0 0 350px; padding:20px 0;}
.loginArea {width:240px; margin:0 auto; line-height:34px; text-align:left;}
.loginArea input {width:100%; height:28px; border:1px solid #ddd; padding:0 8px;}
.loginArea .submitBtn {margin-top:12px; color:#ffffff; font-weight:bold; background:#1292e0; 
  border:#0282d0 1px solid; cursor:pointer; width:100%; height:36px; border-radius:4px;}
.loginArea .reg_bar {font-size:13px; color:#606060; display:block; margin-top:10px;}
.loginArea .reg_bar a {color:#2560b0; text-decoration:none;}
.loginArea .reg_bar a:hover {color:#ff5060;}
#j_checkcode {height:28px; vertical-align:bottom;}
.loginArea img {height:28px !important; width:auto !important; vertical-align:bottom; 
  margin-left:8px; cursor:pointer; border:1px solid #ddd; border-radius:3px;}
.fr {float:right;}
.fr a {font-weight:normal;}

@media screen and (max-width:768px) {
  .loginTit {background-size:auto 42px !important; background-position:center top; 
    padding:50px 15px 0; margin:0 auto; max-width:90%;}
  .lt_cont {margin-left:0; padding-left:0; border-left:none; text-align:center; 
    width:100%; padding:10px 0; font-size:20px; border-top:1px solid #e0e0e0;}
  #loginmain {padding:0 10px;}
  .box_mid {flex-direction:column; margin:20px auto; width:100%; 
    max-width:100%; border-width:5px;}
  .box_l {width:100% !important; height:auto; min-height:0; aspect-ratio:16/9; 
    background-size:contain !important; background-position:center !important; justify-content:flex-end;}
  .box_l a {font-size:16px; padding:6px 10px; margin:10px;}
  .box_r {width:100%; flex-basis:auto; padding:15px; float:none;}
  .loginArea {width:100%; max-width:280px;}
  .loginArea input {font-size:16px !important; /* iOS不放大页面的关键设置 */}
  .loginArea img {height:32px !important;}
  #j_checkcode {height:32px; width:90px !important;}
}

@media screen and (max-width:480px) {
  .loginTit {background-size:auto 42px !important; background-position:center top; 
    padding:50px 15px 0; margin:0 auto; max-width:90%;}
  .lt_cont {font-size:18px; padding:8px 0;}
  .box_l {aspect-ratio:4/3;}
  .box_l a {font-size:14px;}
  .loginArea {font-size:14px;}
  #j_checkcode {width:70px !important;}
}

@media screen and (max-width:360px) {
  .loginTit {background-size:auto 34px !important; padding-top:40px; max-width:80%;}
  .lt_cont {font-size:16px;}
  .box_l a {font-size:13px; padding:5px 8px; margin:8px;}
  .loginArea {max-width:100%; padding:0 10px;}
}