@charset "UTF-8";
// *{ margin: 0; padding: 0; list-style: none; border: 0; text-decoration: none;}
body{ color: #333; font-size: 14px; background: #fafafa;}
/**, *::before, *::after{ box-sizing: content-box!important;}*/

/* --common-- */
.col333{ color: #333;} 
/* --//common-- */

.htmlWrap{ position: relative; margin: 10px 1%; width: 98%; background: #fff; overflow: hidden;}
.img-content{ position: absolute; top: 10px; left: 10px; /*float: left; padding: 10px; */width: 300px;}
.effectBox { width: 300px;/* height: 325px;*/}
.effectBox a.phone-display { display: block; position: relative; width: 300px; height: 245px; border-radius: 6px;}
.bottom-nav{ margin-top: 8px; }
.bottom-nav .tab-btn{ position: relative; width: 25px; height: 58px; cursor: pointer;}
.tab-btn:hover{ opacity: .6; }
.tab-btn.btn-left{  float: left;}
.tab-btn.btn-right{ float: right;}
.shift-icon { position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); width: 16px; height: 16px; border: 1px solid #999; border-radius: 50%; }
.shift-icon>span {  position: absolute;  left: 50%;  top: 50%;  width: 6px;  height: 6px;  border-bottom: 1.5px solid #999;  }
.btn-left i.shift-icon>span {  border-left: 1.5px solid #999;  transform: translate(-30%, -50%) rotate(45deg);  }
.btn-right i.shift-icon>span {  border-right: 1.5px solid #999;  transform: translate(-70%, -50%) rotate(-45deg);  }
.bottom-nav div.bottom-center-nav{  position: relative;  height: 58px;  margin: 0 20px;  overflow: hidden;  }
.bottom-center-nav ul.small-img-ul {  position: absolute;  left: 0;  top: 0;  height: 58px;  }
ul.small-img-ul li.img{  float: left; 
    margin: 0 5px 2px 0;
    box-sizing: content-box;
      width: 54px;  height: 54px;  border:0px solid transparent; border-radius: 5px;  background-size: 100% 100%;  cursor: pointer;  }
ul.small-img-ul li.img.active{  border-color:#b30000; }

/* --竞拍-其他样式-- */
.contentParts{ position: relative; margin-left: 325px; padding: 10px 10px 10px 0; height: 310px;}
.contentParts .mainText{ margin-right: 300px; height: 300px; border-right: 1px solid #eaeaea;}
.contentParts .mainText h4{ margin: 8px 0 16px; font-size: 24px;}
.stateBlock{ margin: 5px 0;}
.stateBlock.stateRed{}
.stateBlock .stateIco{ padding: 3px 6px; border-radius: 3px; color: #fff; background: #999;}
.stateBlock.stateRed .stateIco{ background: #b30000;}
.stateBlock .staeTime{ color: #999;}
.stateBlock.stateRed .staeTime{ color: #b30000;}
.stateBlock p{ margin:3px 0 5px; line-height: 2; color: #666;}
.stateBlock p span{ margin-right: 10px;}
.priceBlock{ height: 56px; line-height: 56px;}
.priceBlock span{ font-size: 24px; font-weight: bold;}
.saleBlock{ height: 56px;}
.saleBlock span{ font-size: 24px; font-weight: bold; color: #b30000; position: relative; top: 2px;}
.saleBlock input[type="text"]{ padding: 2px; width: 200px; height: auto; border: 1px solid #ddd; border-radius: 2px;}
.saleBlock button{ width: 64px; height: auto; line-height: 32px; text-align: center; background: #b30000; color: #fff; border-radius: 3px; cursor: pointer;margin: 0px;padding: 0px;border: none;}
.otherInform{}
.otherInform span{ display:inline-block; float: left; width: 49%; line-height: 2;}
.contentParts .rightInform{ position: absolute; top: 10px; right: 15px; width: 280px;}
.contentParts .rightInform ul{}
.contentParts .rightInform ul li{ margin: 2px 0 8px; line-height: 1.8; color: #999;}
.auction-not-started{ height: 48px;}
.auction-not-started span{ font-size: 20px; font-weight: bold; color: #b30000;}