/* index */
@charset "UTF-8";

body{ background-color: #ffffff;}
.bg-f5f7f9 {background-color: #f5f7f9;}
.top-right-tel { color: #ffffff !important;}
/* banner */
.index-img { position: relative; overflow: hidden;}
.index-img img {display: block; width: 100%; margin: 0 auto;}
.index-img-dsc {position:absolute;width:1280px;left:50%;top:50%;-webkit-transform:translateY(-60%);transform:translateY(-60%);font-size:14px;z-index:2; text-align: left; margin-left: -640px; color: #ffffff;}
.index-img-dsc span{font-size:39px; display: block; margin-bottom: 10px;}
.index-img-dsc h1 {display: block;font-size:23px;padding:0;font-weight:normal;}
.index-search-box { display:inline-block;vertical-align:middle; border-radius: 5px; height: 50px; margin-top: 30px; padding: 3px; background-color: #ffffff; box-sizing: border-box; position: relative; width: 470px;}
.index-search-box input {width:380px;height:44px;font-size:16px;border:none;border-radius:18px; text-indent: 10px; float: left; box-sizing: border-box; text-overflow: ellipsis; padding-right: 40px;}
.index-search-btn { float: right; width: 80px; height: 44px; text-align: center; cursor: pointer; background: #fa2c19; color: #ffffff; font-size: 16px; border-radius: 0 5px 5px 0; letter-spacing: 3px;}
.index-img-dsc em { display: block; line-height: 30px; font-size: 18px; margin-bottom: 3px;}

/* index-price */
.index-bg { position: relative;}
.index-price { position: relative; height: 250px; box-shadow: 0 0 12px rgb(0 0 0 / 10%); border: 0 solid rgba(0,0,0,.1); border-radius: 5px; margin: -26px auto 0; box-sizing: border-box; background-color: #ffffff; z-index: 6;}
.index-price-left { width: 840px; height: 250px; padding: 30px 40px 46px; -moz-box-sizing: border-box; box-sizing: border-box;}
	.index-price-search { overflow: hidden; line-height: 36px;height: 36px;}
	.index-price-search span {font-size:20px;color:rgba(0,0,0,.8);vertical-align:middle;height:36px;line-height:36px; font-weight: bold; color: #181818; letter-spacing: 1px; position: relative; padding-right: 20px; float: left;}
	.index-price-search span:after { content: ''; position: absolute; right: 0; top: 50%; width: 0; height: 0; border: 6px solid #181818; border-right-color: transparent; border-top-color: transparent; border-bottom-color: transparent; margin-top: -6px;}
	.index-price-search p { float: right; line-height: 36px;}
	.index-price-search em { float: left; line-height: 36px; margin-left: 30px;}
	.index-price-main { margin: 30px 0 0;}
	.index-price-main ul { margin: 0 0 19px; display: block; height: 36px;}
	.index-price-main ul a{float:left;font-size:14px;color:rgba(0,0,0,.8);width:92px;line-height:36px}
	.index-price-main ul a:hover {color: #fa2c19;}
	.index-price-main ul a img { width: 40px; float: left;}
	.index-price-main ul a span { display: block; overflow: hidden; line-height: 24px; width: 100%; margin: 0 auto; text-indent: 5px;}
	.index-price-main ul a.index-brand-last img { width: 30px; margin-bottom: 5px; margin-top: 5px; opacity: .6; margin-left: 1px;}
.index-price-right {padding:30px 25px 40px 30px;width:440px;height:250px;float:right;-moz-box-sizing:border-box;box-sizing:border-box}
	.index-price-right-main { overflow: hidden;}
	.saletips { opacity: 0;}
	.index-price-sale { margin-top: 30px; height: 44px;}
	.index-price-sale input {background:rgba(255,255,255,.61);border:1px solid rgba(0,0,0,.14);border-radius:4px 0 0 4px;width:265px;height:44px;float:left; line-height: 38px; box-sizing: border-box; padding: 0 10px;}
	.index-price-sale input:focus { border-color: #fa2c19;}
	.index-price-sale-btn{width:120px;height:44px;float:left;text-align:center;line-height:44px;background:#fa2c19;border-radius:0 4px 4px 0;color:#fff;font-size:18px;border:none; opacity: .7; cursor: default;}
	.index-price-sale-btn.active { opacity: 1; cursor: pointer;}
	.index-price-chk { overflow: hidden; margin-top: 20px; width: 385px;}
	.index-chk {float: left; width: 14px; height: 14px; margin-top: 2px; margin-right: 5px;box-sizing: border-box; background: url('../image/b_checkbox_off.png') no-repeat center; background-size: 100%;}
	.index-chk.active {background: url('../image/b_checkbox_on.png') no-repeat center; background-size: 100%;}
	.index-chk-dsc { float: left; color: #999999; font-size: 12px; width: 365px; line-height: 20px;}
	.index-chk-dsc a {color: #fa2c19;}
	
	/* modal */
	.tel-msg {position: fixed; top: 0;right: 0;left: 0;bottom: 0; z-index: 100;}
	.modal-title { margin-top: 50px; font-size: 16px;}
	.modal-title2 { font-size:14px; color:#fa2c19; text-align: center;}
	

/* search */
.search-hot { margin-top: 50px; width: 100%; overflow: hidden;}
	.search-hot-item { padding: 0 10px; line-height: 40px; cursor: pointer; transition: all .2s; color: #8b8b8b;float: left;}
	.search-hot-item:hover {color: #eeeeee;}
	
/* recommend */
.recommend { padding: 50px 0;}
.rec-main { float:left;overflow: hidden; margin-top: 20px;}
	.rec-box { float: left; width: 100%; position: relative;}
		.rec-con { overflow: hidden;}
		.hotlist-a { float: left; margin-right: 20px; margin-bottom: 20px; width: 305px; overflow: hidden;}
		.hotlist-a:nth-child(4n) { margin-right: 0;}
		.hotlist-info { display: block; overflow: hidden;}
		.hotlist-img { display: block; overflow: hidden; height: 230px;}
		.hotlist-img img { display: block; transition: all .4s;}
		.hotlist-a:hover img { transform: scale(1.1);}
		.hotlist-name { display: block; font-size: 15px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; line-height: 30px; margin: 7px auto 0; transition: all .4s;}
		.hotlist-date { line-height: 20px; font-size: 12px; color: #999999;}
		.hotlist-date span {float: right;color: #0fbdf1;border: 1px solid #caf3ff;line-height: 18px;padding: 0 3px;}
		.hotlist-a:hover .hotlist-name {color: #fa2c19;}
		.hotlist-price { overflow: hidden; line-height: 30px; height: 30px; color: #fa2c19;}
		.hotlist-price span { float: left; font-size: 20px;}
		.hotlist-price em { font-size: 14px; padding-left: 3px; float: left; line-height: 36px;}

/* title */
.index-title { font-size: 24px; letter-spacing: 2px; line-height: 70px; color: rgba(0,0,0,.8); overflow: hidden;}
	.index-title p { float: right; color: #111111; font-size: 15px; line-height: 70px; letter-spacing: 0;}
	.index-title-title { float: left;}
	.rec-tabs { float: left; margin-left: 25px; font-size: 16px; letter-spacing: 0; position: relative; line-height: 40px; margin-top: 15px;}
	.rec-tabs::after { content: ''; position: absolute; left: 0; top: 50%; width: 2px; height: 20px; margin-top: -10px; background-color: #eeeeee;}
	.rec-tabs span { float: left; margin-left: 25px; cursor: pointer; border-bottom: 2px solid #ffffff; color: rgba(0,0,0,.6);}
	.rec-tabs span.current {color: #fa2c19; border-color: #fa2c19;}

/* series */
.hotseries { padding: 50px 0; float:left;width:100%;}
.hotseries-main {overflow: hidden; padding: 40px 0; background-color: #ffffff; box-shadow: 0 0 12px rgb(0 0 0 / 10%); border-radius: 5px;}
	.hotseries-a { float: left; margin-right: 15px; padding: 10px 0 0 25px; margin-bottom: 20px; width: 244px; box-sizing: border-box; border-radius: 3px; display: flex; align-items: center; position: relative;}
	.hotseries-a::after { content: ''; position: absolute; left: 0; top: 50%; height: 60px; margin-top: -30px; width: 1px; background-color: #eeeeee;}
	.hotseries-a:nth-child(5n) { margin-right: 0;}
	.hotseries-a:nth-child(5n+1) { padding-left: 20px;}
	.hotseries-a:nth-child(5n+1):after { display: none;}
	.hotseries-img { float: left; width: 110px;}
	.hotseries-img img { width: 96%;}
	.hotseries-info { float: left; width: 104px;}
	.hotseries-info span { font-size: 16px; display: block; overflow: hidden; line-height: 26px;}
	.hotseries-info p { display: block; overflow: hidden; color: #999999; line-height: 20px; font-size: 12px;}
	.hotseries-price { color: #fa2c19; line-height: 30px; height: 30px; font-size: 24px; margin-top: 3px;}
	.hotseries-price em { font-size: 12px; padding-left: 3px;}


/* news */
.news { padding: 50px 0;float:left;width:100%;}
.news-main { margin: 30px auto 0; overflow: hidden;}
.news-item { width: 426px; margin-bottom: 30px; overflow: hidden;}
.news-item:nth-child(even) { margin-right: 0;}
.news-info { width: 400px;margin-right:30px;}
.news-info:nth-child(3n) { margin-right: 0;}
.news-date { font-size: 14px; font-weight: 700; font-family: Arial; color: #999999;}
.news-title {font-size: 18px; font-weight: 700; color: #333; margin: 6px 0; transition: all .5s; line-height: 26px; height: 26px; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; transition: all .3s;}
.news-item:hover .news-title {color: #fa2c19;}
.news-dsc { color: #888888; margin-bottom: 18px; line-height: 20px; height: 40px; display: -webkit-box; overflow: hidden; -webkit-box-orient: vertical; text-overflow: ellipsis; -webkit-line-clamp: 3; }
.news-more { position: relative; height: 14px; line-height: 14px; padding-left: 50px; color: #fa2c19;transition: all .5s;}
.news-more::after { content: ''; position: absolute; left: 0; top: 6px; width: 40px; height: 1px; background-color: #fa2c19;transition: all .5s;}
.news-more:hover { padding-left: 70px;}
.news-more:hover::after { width: 60px;}

/* progress */
.progress { padding: 50px 0;float:left;width:100%;}
.progress-box .rec-tabs span { border-color: #f5f7f9;}
.progress-box .rec-tabs span.current { border-color: #fa2c19;}
.progress-body { margin-top: 50px; position: relative; height: 152px;}
.progress-con { padding-bottom: 20px; overflow: hidden; position: absolute; top: 0; left: 0;}
.progress-con li { float: left; width: 300px; position: relative; text-align: center; white-space: nowrap;}
.progress-img { margin: 0 auto; display: block; width: 60px;height: 60px;}
.progress-con li span { font-size: 18px; line-height: 25px; margin-top: 20px; color: rgba(0,0,0,.8); display: block;}
.progress-con li p { font-size: 15px; line-height: 22px; color: rgba(0,0,0,.36); margin-top: 5px;}
.progress-to { position: absolute; top: 42px; right: -18px; height: 17px; width: 37px;}
.progress-con li:last-child .progress-to {display: none;}