@charset "UTF-8";
/*basic css*/
html {font-family: sans-serif; }
/*内容全局多级通用css*/
*, ::after, ::before { box-sizing: border-box; }
* {margin: 0;  padding: 0; }
a{ color: -webkit-link; cursor: pointer;  text-decoration: none;}
ul, ol, li {list-style-type: none;}
img {border: 0;vertical-align: middle;max-width: 100%;}

/** --  PC背景与移动端个性化切换 ---*/
 #baij, .Mpbj {transition: background-image 0.5s ease; margin: 0; background-position: center;  background-repeat: no-repeat;  background-size: cover; }
 #baij {width: 100%; height: 100vh; }
 .Mpbj {width: 100%; height: 100%; position:fixed;  background-image: url('https://www.huining.net/shimg/bjimg/mbj1.webp');  }
 
 .preview {width: 120px;  height: 80px;  border: 2px solid #fff; margin: 7px;  background-size: cover;  background-position: center;
    display: inline-block;  cursor: pointer; transition: transform .3s ease-out;}
 .prColor {width: 60px; height: 30px; border: 2px solid #fff;  margin: 7px; display: inline-block;  text-align: center;  cursor: pointer; transition: transform .3s ease-out;  }
 .preview.selected, .prColor.selected { border-color: #007BFF; box-shadow: 0 0 10px rgba(0, 123, 255, 0.5); }
 .preview:hover, .prColor:hover {transform: scale(1.04, 1.04);border-color: #00ff1d;  box-shadow: 0 0 10px rgb(237 255 0 / 83%);}
/* 设置自定义颜色预览的背景 */
 #preview1 { background-image: url('https://www.huining.net/shimg/bjimg/HNETbj1.webp'); }
 #preview2 { background-image: url('https://www.huining.net/shimg/bjimg/HNETbj2.webp'); }
 #preview3 { background-image: url('https://www.huining.net/shimg/bjimg/HNETbj3.webp'); }
 #preview4 { background-image: url('https://www.huining.net/shimg/bjimg/HNETbj4.webp'); }
 #preview5 { background-image: url('https://www.huining.net/shimg/bjimg/HNETbj5.webp'); }
 #preview6 { background-image: url('https://www.huining.net/shimg/bjimg/HNETbj6.webp'); }
 #preview7 { background-image: url('https://www.huining.net/shimg/bjimg/HNETbj7.webp'); }
 #preview8 { background-image: url('https://www.huining.net/shimg/bjimg/HNETbj8.webp'); }
  #customPreviewColor1 { background-color: #95d095; }
  #customPreviewColor2 { background-color: #dac2a4; }
  #customPreviewColor3{ background-color: #d3da9f; }
  #customPreviewColor4{ background-color: #80b1c5; }
 
 #customPreview { background-image: none; }

@media screen and (max-width: 360px) {
 /** --  背景pc切换 ---*/
 .PCbj { display: none;}
 .Mpbj {display:block;}
 .meon {display:block;}
}