.main-home { background-color: #f2f2f2; padding-bottom: 80px; overflow: hidden;}
.hm-wrap { width: 1500px; margin: 0 auto; position: relative;}
.md-con { background-color: #fff; border-radius: 5px;}
.md-none { background: none;}
.hm-hide, .md-adv { overflow: hidden; margin-top: 16px;}
.hm-cate { border-radius: 0 0 4px 4px;}
.hm-ad dt i, .hm-nav .hm-ico:before, .hm-nav a:after, .tpr-list dt span:before, .tps-buy:after, .hm-ctg em:after { background: url(https://www.newvast.com/images/home-ico.png) no-repeat;}
.slider { float: left; width: 983px; margin: 16px 16px 0; position: relative; overflow: hidden; border-radius: 4px; z-index: 10;}
.slider .sliderbox { position: relative; height: 440px; overflow: hidden;}
.slider .sliderbox li { left: 0; top: 0;}
.slider .slidernav { position: absolute; left: 50%; margin-left: -60px; bottom: 15px; width: 120px;}
.slider .slidernav li { float: left; height: 10px; width: 20px;}
.slider .slidernav li span, .min-slider .slidernav li span, .mid-slider .slidernav li span { display: block; width: 10px; height: 10px; border-radius: 10px; background: #eee; cursor: pointer;}
.slider .slidernav li.current span, .min-slider .slidernav li.current span, .mid-slider .slidernav li.current span { background: #f30213;}
.hm-ad { float: left; margin-top: 16px; width: 210px; padding: 5px 15px 0 15px; height: 435px; background-color: #fff; overflow: hidden; border-radius: 4px;}
.hm-ad-nav { height: 40px; line-height: 40px; text-align: center; font-size: 16px; font-weight: 700;}
.hm-ad-img { height: 87px; background: url(https://www.newvast.com/images/home/a1.jpg) no-repeat center top;}
.hm-ad dl { width: 220px; margin-right: -10px;}
.hm-ad dt { float: left; padding-left: 5px; width: 200px; height: 40px; line-height: 40px; font-size: 16px; font-weight: 700;}
.hm-ad dt i { margin-left: 10px; background-position: -50px 0; width: 6px; height: 10px; display: inline-block; vertical-align: baseline;}
.hm-ad dd { float: left; height: 135px; width: 100px; margin-right: 10px; text-align: center;}
.hm-ad dd a { display: block; width: 100px; height: 100px; border-radius: 5px; overflow: hidden;}
.hm-ad dd span { display: inline-block; height: 20px; line-height: 20px; background-color: #ff3e29; color: #fff; font-size: 13px; font-weight: 700; padding: 0 10px; border-radius: 10px; margin-top: 5px;}
.hm-adl { position: absolute; left: -176px; top: 0; height: 457px; z-index: 1600;}
.hm-adl a { display: block; width: 176px; height: 457px; transition: width 0.3s ease; background: url(https://www.newvast.com/images/home/l_bg_2.jpg) no-repeat right top;}
.hm-adl:hover a { width: 1420px;}
.hm-nav { padding: 20px 30px; height: 30px; line-height: 30px;}
.md-none .hm-nav { padding: 15px 30px 10px 30px;}
.hm-nav span { display: inline-block; vertical-align: middle; font-weight: normal; font-size: 16px; color: #000;}
.hm-nav em { display: inline-block; vertical-align: middle; height: 30px; font-size: 20px;}
.hm-nav .nav-text { font-size: 14px; color: #999; margin-left: 15px;}
.hm-nav .hm-ico:before { content: ''; display: inline-block; vertical-align: middle; margin-right: 5px; width: 23px; height: 30px; background-position: 0 -126px;}
.time-end { margin: 0 10px 0 30px;}
.hm-nav .cd-time { width: 30px; height: 30px; border-radius: 5px; background-color: #333; color: #fff; text-align: center;}
.hm-nav .time i { margin: 0 5px; font-weight: 700;}
.hm-nav .time em { margin: 0 5px; font-size: 16px;}
.hm-nav a { display: block; float: right; font-size: 14px; color: #999;}
.hm-nav a:after { content: ''; display: inline-block; width: 16px; height: 18px; background-position: -40px -64px; vertical-align: middle; margin-left: 5px;}
.hm-nav a:hover { color: #fa423e;}
.hm-nav a:hover:after { background-position: -40px -27px;}
.hm-list { padding: 0 0 30px 33px; overflow: hidden; background-color: #fff; border-radius: 4px;}
.hm-list li { float: left; margin-right: 15px; width: 165px; position: relative;}
.hm-list li a { display: block; width: 100%; border-radius: 4px; overflow: hidden;}
.hm-pri { display: block; font-size: 14px; font-weight: 700; padding: 10px 0 5px;}
.hm-list del, .hm-rmd del { display: block; color: #999;}
.hm-off { display: inline-block; padding: 0 5px; height: 18px; line-height: 18px; background-color: #ff4747; color: #fff; border-radius: 2px; right: 0; bottom: 0;}
.hm-nav .ico-nav2:before { background-position: -33px -126px;}
.hm-nav .ico-nav3:before { background-position: 0 -161px;}
.hm-nav .ico-nav4:before { background-position: -33px -160px;}
.tpr-list { width: 1500px; overflow: hidden; height: 341px; position: relative;}
.tpr-list .sliderbox { position: absolute; top: 0; width: 3036px; overflow: hidden;}
.tpr-list .sliderbox li { float: left;}
.tpr-list dl { float: left; width: 488px; height: 341px; padding-right: 18px;}
.tpr-list dt { float: left; width: 100%; position: relative;}
.tpr-list dd { float: left; width: 156px; padding: 15px 0 12px; background-color: #fff;}
.tpr-list .tpr-fst { padding-left: 20px;}
.tpr-list .sliderbox li a { display: block; overflow: hidden; position: relative;}
.tpr-list dd a, .tpr-list dd span { max-width: 135px;}
.tpr-list dd a { margin-bottom: 13px; border-radius: 4px;}
.tpr-list dd span { display: block; font-size: 13px; color: #000; font-weight: 700;}
.hm-rmd { max-width: 1434px; height: 300px; padding: 0 33px; position: relative;}
.hm-rmd .tpr-nav { width: 1434px; height: 300px; overflow: hidden; position: relative;}
.hm-rmd .sliderbox { width: 2892px;}
.hm-rmd .sliderbox li { width: 226px; height: 300px; padding-right: 15px;}
.hm-rmd .hm-pri { font-size: 14px;}
.hm-nwa { padding: 0 0 30px 33px;}
.hm-nwa li { float: left; width: 347px; margin-right: 15px;}
.hm-nwa span { display: block; border-radius: 5px; overflow: hidden;}
.hm-nwa strong { display: block; text-transform: uppercase; color: #000; font-size: 16px; padding: 10px 0 5px;}
.hm-nwa em { display: block; font-size: 14px; color: #999;}
.hm-nwa strong:hover, .hm-nwa em:hover { text-decoration: underline;}
.tps-nav { padding: 40px 30px 5px 0;}
.hm-tps { width: 1513px; margin-right: -13px;}
.hm-tps li { float: left; width: 365px; padding-bottom: 20px; margin: 0 13px 16px 0; background-color: #fff; overflow: hidden;}
.hm-tps li div { position: relative; overflow: hidden;}
.hm-tps .tps-link a { display: block; margin-bottom: 4px; width: 119px; height: 119px;}
.hm-tps .tps-link { padding-left: 246px; background-color: #f2f2f2; height: 242px; overflow: hidden;}
.hm-tps .tps-link .tps-fst { position: absolute; left: 0; top: 0; width: 242px; height: 242px;}
.hm-tps strong { display: block; padding: 15px 0 15px 15px; font-size: 16px; color: #000;}
.hm-tps em { display: inline-block; background-color: #fffae7; color: #ff7a58; height: 18px; line-height: 18px; border-radius: 5px; padding: 0 10px; margin-left: 5px; font-weight: 700;}
.hm-tps .tps-buy { display: block; position: absolute; right: 8px; bottom: 32px; padding: 0 15px; height: 20px; line-height: 20px; border: 1px solid #ffb200; border-radius: 10px; color: #ffb200;}
.hm-tps .tps-buy:hover { text-decoration: underline;}
.tps-buy:after { content: ''; display: inline-block; vertical-align: middle; width: 5px; height: 9px; background-position: -51px -207px; margin-left: 4px;}
.hm-brd { height: 200px; width: 1502px; margin-right: -2px; overflow: hidden;}
.hm-brd li { float: left; background-color: #fff; width: 160px; height: 98px; margin: 0 2px 2px 0; text-align: center; overflow: hidden;}
.hm-brd .hmd-nav { width: 206px; height: 200px; background: url(https://www.newvast.com/images/home/brand.jpg) no-repeat center top; margin: 0;}
.hm-brd li span { display: inline-block; vertical-align: middle; max-width: 80%;}
.hm-brd li a:before { content: ''; display: inline-block; height: 100%; vertical-align: middle;}
.hm-brd li:hover span { transform: scale(1.05); transition: linear 0.3s;}
.hm-ctg { width: 1510px; overflow: hidden; margin-right: -10px;}
.hm-ctg li { float: left; width: 292px; height: 305px; background-color: #fff; margin: 0 10px 10px 0;}
.hm-ctg .ctg-nav { width: 594px;}
.hm-ctg span { display: block; padding: 22px 25px 10px 25px; margin: 0 auto;}
.hm-ctg em { display: block; text-align: center; font-size: 14px;}
.hm-ctg em:after { content: ''; display: inline-block; margin-left: 5px; width: 5px; height: 11px; background-position: -51px -102px; vertical-align: middle;}
.hm-ctg em:hover { text-decoration: underline;}
.hm-ctg .ctg-nav span { padding: 12px 10px;}
.hm-bot { padding: 30px 0 0 24px; background-color: #fff;}
.hm-bot li { float: left; width: 222px; height: 330px; margin-right: 24px;}
.hm-bot span, .hm-bot a { display: block;}
.hm-bot em { display: block; color: #ff4761; font-size: 15px; font-weight: 700; padding: 10px 0;}
.hm-bot .hm-tit { height: 24px; line-height: 24px; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; font-size: 14px; color: #999;}
.hm-bot .hm-tit:hover { text-decoration: underline;}
.hm-ad-img a, .md-adv a, .hm-nwa li a, .hm-brd li a, .hm-ctg li a { display: block; width: 100%; height: 100%; position: relative;}
.hm-list li img, .tpr-list img, .md-adv img, .hm-nwa img, .hm-tps img, .hm-brd img, .hm-ctg img, .hm-bot img { width: 100%;}
.hm-list img:hover, .md-adv img:hover, .hm-nwa img:hover, .hm-tps img:hover, .hm-ctg img:hover, .hm-bot img:hover { filter: alpha(opacity=90); opacity: 0.90;}
.hm-wrap h1 { padding: 50px 0 20px 0; text-align: center; font-size: 18px; color: #000; font-family: Verdana, Geneva, sans-serif;}
.hm-wrap h1 span { font-size: 16px; font-weight: normal;}
.hm-desc { width: 1200px; margin: 0 auto; color: #999; font-size: 13px; line-height: 150%; font-family: Verdana, Geneva, sans-serif;}
.hm-tps li:hover, .hm-ctg li:hover { box-shadow: 0 4px 12px rgba(0,0,0,.08);}
.hm-mask { display: block; position: absolute; left: 0; top: 0; background-color: #000; opacity: 0.03; width: 100%; height: 100%; transition: all 0.3s;}
.hm-mask:hover { opacity: 0.08;}
@media (max-width: 1800px) and (min-width: 1440px){
.md-con, .hm-wrap { width: 1360px;}
.slider { width: 855px; margin: 16px 10px 0 10px;}
.hm-list { width: 1360px;}
.hm-list li { width: 150px; margin-right: 15px;}
.tpr-list { width: 1360px; height: 325px;}
.tpr-list .sliderbox { width: 2745px;}
.tpr-list dl { width: 447px; height: 325px; padding-right: 10px;}
.tpr-list dd { width: 144px; padding: 14px 0 12px;}
.tpr-list .tpr-fst { padding-left: 15px;}
.tpr-list dd a, .tpr-list dd span { max-width: 130px;}
.hm-rmd, .hm-rmd .tpr-nav { width: 1294px; height: 280px;}
.hm-rmd .sliderbox li { width: 204px; height: 280px;}
.hm-nwa li { width: 312px;}
.hm-tps { width: 1373px;}
.hm-tps li { width: 330px;}
.hm-tps .tps-link a { width: 107px; height: 107px;}
.hm-tps .tps-link { padding-left: 223px; height: 218px;}
.hm-tps .tps-link .tps-fst { width: 218px; height: 218px;}
.hm-brd { width: 1362px;}
.hm-brd .hmd-nav { width: 202px;}
.hm-brd li { width: 143px;}
.hm-tps strong { font-size: 14px;}
.hm-ctg { width: 1370px;}
.hm-ctg li { width: 264px; height: 272px;}
.hm-ctg .ctg-nav { width: 538px;}
.hm-ctg span { padding: 14px 18px 5px 18px;}
.hm-bot { padding: 30px 0 0 22px;}
.hm-bot li { width: 201px; height: 310px; margin-right: 22px;}
}
@media (max-width: 1439px) {
.md-con, .hm-wrap { width: 1200px;}
.slider { width: 695px; margin: 16px 10px 0 10px;}
.hm-list { width: 1200px;}
.hm-list li { width: 136px; margin-right: 10px;}
.tpr-list { width: 1200px; height: 295px;}
.tpr-list .sliderbox { width: 2420px;}
.tpr-list dl { width: 394px; height: 295px; padding-right: 9px;}
.tpr-list dd { width: 128px; padding: 14px 0 12px;}
.tpr-list .tpr-fst { padding-left: 10px;}
.tpr-list dd a, .tpr-list dd span { max-width: 118px;}
.hm-nwa li { width: 272px;}
.hm-rmd, .hm-rmd .tpr-nav { width: 1134px; height: 260px;}
.hm-rmd .sliderbox li { width: 182px; height: 260px; padding-right: 10px;}
.hm-nwa strong, .hm-tps strong { font-size: 14px;}
.hm-tps { width: 1213px;}
.hm-tps li { width: 290px;}
.hm-tps .tps-link a { width: 95px; height: 95px; margin-bottom: 2px;}
.hm-tps .tps-link { padding-left: 195px; height: 192px;}
.hm-tps .tps-link .tps-fst { width: 192px; height: 192px;}
.hm-tps .tps-buy { bottom: 0;}
.hm-brd { width: 1202px;}
.hm-brd .hmd-nav { width: 202px;}
.hm-brd li { width: 123px;}
.hm-ctg { width: 1210px;}
.hm-ctg li { width: 232px; height: 240px;}
.hm-ctg .ctg-nav { width: 474px;}
.hm-ctg span { padding: 14px 18px 5px 18px;}
.hm-bot { padding: 30px 0 0 22px;}
.hm-bot li { width: 174px; height: 310px; margin-right: 22px;}
}