/* ============================================================
   wl21 UI Refresh Layer (Class-21 sub-site)
   Keeps the existing red/dark look, modernizes type, cards, hover.
   ASCII-only content: safe with any page charset.
   Loaded after css/global.css + css/Inside.css.
   ============================================================ */

body {
  font-family: "Microsoft YaHei", "PingFang SC", "Hiragino Sans GB", "Segoe UI", Arial, sans-serif;
  font-size: 13px; color: #4a5158; line-height: 1.8;
  -webkit-font-smoothing: antialiased;
}
a { transition: color .15s ease, opacity .15s ease; }
a:hover { color: #b51b25; }
::selection { background: #ffd7da; color: #5a1015; }
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: #f1f3f5; }
::-webkit-scrollbar-thumb { background: #c8ced5; border-radius: 6px; border: 2px solid #f1f3f5; }
::-webkit-scrollbar-thumb:hover { background: #aab4be; }

/* ---- top / logo row ---- */
.top { box-shadow: 0 1px 4px rgba(0, 0, 0, .06); }
.logo_l img { transition: opacity .2s ease; }
.logo_l a:hover img { opacity: .92; }
.logo_r input {
  border-radius: 4px; transition: box-shadow .15s ease;
  background-image: none; background: #fff; border: 1px solid #e2e6ea; color: #666;
}
.logo_r input:focus { outline: none; box-shadow: 0 0 0 3px rgba(181, 27, 37, .12); border-color: #d9a2a6; }

/* ---- image-button menu: lift on hover ---- */
.menu li { transition: transform .18s ease; }
.menu li:hover { transform: translateY(-2px); }
.menu li a { display: block; border-radius: 4px; overflow: hidden; }
.menu li a img { border-radius: 4px; transition: box-shadow .2s ease; }
.menu li:hover a img { box-shadow: 0 4px 12px rgba(0, 0, 0, .22); }

/* ---- homepage slider controls ---- */
.prev img, .next img { border-radius: 50%; box-shadow: 0 2px 8px rgba(0, 0, 0, .25); }
.item a { border-radius: 3px; }

/* ---- footer ---- */
#bottom_bg { background: linear-gradient(180deg, #454b52, #33383e) !important; border-top: none; }
#bottom, #bottom a { color: #aeb6bf; }
#bottom a:hover { color: #fff; }

/* ---- buttons / links ---- */
.chakan { border-radius: 4px; transition: opacity .15s; }
.chakan:hover { opacity: .85; }

/* ---- inner sidebar contact icons: align with text ---- */
.contact p img { vertical-align: middle; margin-right: 5px; }
.contact p img[src*="qing"] { vertical-align: baseline; margin-right: 0; margin-top: -8px; }