body{
	background:rgba(34, 34, 34, .9);
	overflow: hidden;
}
.commodity-scroll-nav>h1{
	font-size:16px;
	color:#fff;
	line-height: 20px;
	text-align: center;
	margin:20px 0;
}

.commodity-scroll-nav>h1>span{font-size:12px;}

.commodity-scroll-nav .categorylvone{
	border-bottom: solid 1px #4c4c4c;
	padding-bottom: 10px;
}
.commodity-scroll-nav .categorylvone>ul, 
.commodity-scroll-nav .categorylvone>ul>li{margin:0; padding:0; }
.commodity-scroll-nav .categorylvone>ul{list-style: none; width:100%;}
.commodity-scroll-nav .categorylvone>ul>li{
	width:33%;
	text-align: center;
	float:left;
	line-height: 20px;
	font-size:14px;
	color:#ccc;
	cursor: pointer;
	position: relative;
}

.commodity-scroll-nav .categorylvone>ul>li.active {
	color:#fff;
	font-weight: 700;
}

.commodity-scroll-nav .categorylvone>ul>li>i{position: absolute; left:0;bottom:-10px;  width:100%;height: 2px;display: none; text-align: center;}
.commodity-scroll-nav .categorylvone>ul>li>i b{position: absolute;top:50%; left:50%;display: inline-block; margin-left:-10px; width:20px; height: 100%; background-color: #227EFF; border-radius: 2px;}
.commodity-scroll-nav .categorylvone>ul>li.active>i{display: inline-block;}




.room-scroll-nav .categorylvtwo{
	border-bottom: solid 1px #4c4c4c;
	padding: 10px 0;
	overflow: hidden;
}
.room-scroll-nav>.categorylvtwo>ul, 
.room-scroll-nav>.categorylvtwo>ul>li{margin:0; padding:0; }
.room-scroll-nav >.categorylvtwo>ul{list-style: none; width:2000px;}
.room-scroll-nav >.categorylvtwo>ul>li{
	width:100px;
	text-align: center;
	float:left;
	line-height: 20px;
	font-size:14px;
	color:#ccc;
	cursor: pointer;
	position: relative;
}

.room-scroll-nav >.categorylvtwo>ul>li.cur {
	color:#fff;
	font-weight: 700;
}

.room-scroll-nav >.categorylvtwo>ul>li>i{position: absolute; left:0;bottom:0;  width:100%;height: 2px;display: none; text-align: center;}
.room-scroll-nav >.categorylvtwo>ul>li>i b{position: absolute;top:50%; left:50%;display: inline-block; margin-left:-10px; width:20px; height: 100%; background-color: #227EFF; border-radius: 2px;}
.room-scroll-nav >.categorylvtwo>ul>li.cur>i{display: inline-block;}



.room-scroll-nav .categorylvthree{
	border-bottom: solid 1px #4c4c4c;
	padding: 10px 0;
}
.room-scroll-nav>.categorylvthree>ul, 
.room-scroll-nav>.categorylvthree>ul>li{margin:0; padding:0; }
.room-scroll-nav >.categorylvthree>ul{list-style: none; width:2000px;}
.room-scroll-nav >.categorylvthree>ul>li{
	width:100px;
	text-align: center;
	float:left;
	line-height: 20px;
	font-size:14px;
	color:#ccc;
	cursor: pointer;
	position: relative;
}

.room-scroll-nav >.categorylvthree>ul>li.active {
	color:#fff;
	font-weight: 700;
}

.room-scroll-nav >.categorylvthree>ul>li>i{position: absolute; left:0;bottom:0;  width:100%;height: 2px;display: none; text-align: center;}
.room-scroll-nav >.categorylvthree>ul>li>i b{position: absolute;top:50%; left:50%;display: inline-block; margin-left:-10px; width:20px; height: 100%; background-color: #227EFF; border-radius: 2px;}
.room-scroll-nav >.categorylvthree>ul>li.active>i{display: inline-block;}



.wrapper  .tt>ul{list-style: none; width:100%;}
.wrapper  .tt>ul>li{
	font-size:14px;
	width:40px;
	/* display: inline-block; */
	float: left;
}

.item-list {
    position: absolute;
    left: 0;
	height: calc(100% - 112px);
	width: calc(100% - 20px);
    /*display: inline-block !important;*/
    text-align: center !important;
	/* overflow:auto !important; */
	overflow:hidden !important;
    padding:0 10px 10px;
    display: none !important;
}

.item-list.active{
	display: inline-block !important;
}

.room-list {
    overflow: hidden;
    height: calc(100% - 21px);
    /* width: calc(100% - 20px); */
	padding: 0;
}

.room-list>ul {
    overflow: auto;
	/* width: calc(100% - 20px); */
	/* height:8500px; */
	padding: 0;
	position:relative
}

.item {
	width:calc(100% - 20px);
	height:75px;
	padding:10px;
	margin-bottom: 10px;
	background-color: #ffffff;
	border-radius: 2px;
	display: none;
}
.item.active{
	display: list-item;
}
.room-item-list {
    position: absolute;
    left: 0;
    height: calc(100% - 176px);
    /*display: inline-block !important;*/
    text-align: center !important;
    overflow:auto !important;
    padding:10px 10px;
}

.room-name{
	float:left;
	width:calc(100% - 30px);
	font-size:18px;
	text-align: left;
	margin-left:15px;
	color: #227EFF;
    font-weight: 700;
}

.main {

	position:relative;

	/* overflow:hidden */

}

.pic {
	width:100px;
	height:100px;
	float:left;

}

.despinfo{
	float:left;
	width:calc(100% - 30px);
	font-size:14px;
	text-align: left;
	margin-left:15px;
}
.despinfo>p:first-child{
	color:#303a40;
	min-height: 15px;
	line-height: 15px;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
	overflow: hidden;
	margin: 0;
	padding: 1em 0;
}
.despinfo>p:first-child + p{
	color:#a8afb3;
	line-height: 15px;
	font-size: 12px;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	word-break: break-all;
	overflow-wrap: break-word;
   
    white-space:normal;
}
.despinfo>p:first-child + p i{
	display: inline-block;
	width:13px;
	height: 11px;
	margin-right: 7px;
	background: url(shop@2x.png) no-repeat center center;
	background-size: contain;
}
.despinfo>p:first-child + p + p{
	line-height: 15px;
	font-size: 16px;
	color:#227EFF;
    font-weight: 700;
    float: right;
    position: absolute;
    right:10px;
    top:40px;
}
.despinfo>p:first-child + p + p i{
	float: right;
	height: 18px;
	border-radius: 50%;
	background: url(cart_2@2x.png) no-repeat center center;
	background-size: contain;
	position: relative;
	top:9px;
}

.item-room {
	width:calc(100% - 20px);
	padding:10px;
	margin-bottom: 10px;
	background-color: #cccccc;
	border-radius: 2px;
	display: none !important;
}

.item-room.active{
	display: inline-block !important;
}

.hidden_price{
	font-style: normal;
    padding: 0 5px;
}
.hidden_price.bd1{
	border: solid 1px #227EFF;
}
.hidden_price.bd3{
	padding:0;
}

.commodity-scroll-footer{
	position: absolute; 
	right:0;
	bottom: 20px; 
	width:110px; 
	border-top-left-radius: 15px;
	border-bottom-left-radius: 15px;
	background-color: #227EFF;
	height: 30px; 
	line-height: 30px;
	text-align: center; 
	font-size:13px; 
	color:#fff;
}

.commodity-scroll-footer a{
	display: inline-block; 
	width:100%; 
	height:100%; 
	text-align: center; 
	color:inherit; 
	text-decoration: none;
}

.scroll-bar {
	position:absolute;

    -webkit-transition:-webkit-transform .3s ease-in-out;

    transition:-webkit-transform .3s ease-in-out;

    transition:transform .3s ease-in-out;

    transition:transform .3s ease-in-out, -webkit-transform .3s ease-in-out;

	text-align:center;

	z-index:3000;

	-webkit-user-select:none;

	-moz-user-select:none;

	-ms-user-select:none;

	user-select:none;

	overflow:hidden

}

.scroll-bar .item-list{

	position:relative;

	display:inline-block;

	overflow:auto;

	text-align:center;

	font-size:0

}

.scroll-bar .room-item-list {

	position:relative;

	/* display:inline-block; */

	overflow:hidden;

	text-align:center;

	font-size:0

}

.scroll-bar .item {

	position:relative;

	cursor:pointer

}

.scroll-bar.horizontal {

	left:0;

	top:0;

	width:100%;

	height: calc(100% - 19px);

	padding:19px 0 0

}

.scroll-bar.horizontal .item {

	float:left

}

.scroll-bar.vertical {

	top:0;

	right:0;

	-webkit-transform:translate3d(100%, 0, 0);

	transform:translate3d(100%, 0, 0);

	height:100%;

	padding:0 12px

}

.clearfix:after {

	display:table;

	content:"";

	clear:both

}