You cannot select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

828 lines
14 KiB
CSS

5 years ago
/*---------手游联运升级V5.1项目联运APP/WAP站---交易模块-------*/
/*---------@author zwm -------*/
/*---------date 2018-07-14 -------*/
*{
padding:0;
margin:0;
box-sizing:border-box;
font-family:"Microsoft YaHei";
}
/* 媒体对象 begin*/
.media, .media-body {
overflow: hidden;
zoom: 1;
}
.media-body, .media-left, .media-right {
display: table-cell;
vertical-align: middle;
}
.media-body{
width:10000px;
}
.media-left{
padding-right:10px;
}
.media-object {
display: block;
}
/*end 媒体对象*/
.z_clearfix:after{
display:block;
content:"";
height:0;
line-height:0;
visibility:hidden;
clear:both;
}
.z_clearfix{
zoom:1;
}
.marg_t5{
margin-top:5rem;
}
.shortcut .trade_topul li{
width:25%;
}
.trade-header{
background-color: #fff;
color: #585858;
border-bottom:1px solid #c2c2c2;
}
.trade_caption{
margin: 0 6rem;
display: block;
position: relative;
text-align: center;
font-weight: normal;
font-size: 2.2rem;
padding: 1.2rem 1rem;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
}
.z_instruction{
position: absolute;
right: 1.5rem;
top: 50%;
margin-top: -1.2rem;
padding: .25rem .8rem;
border: 1px solid #ebebeb;
border-radius: 30px;
color: rgb(153,153,153);
}
.trade_tit{
height:3.33rem;
padding:1rem 2rem;
position:relative;
width:100%;
}
.new_sell{
position: absolute;
height: 3.33rem;
line-height: 3.33rem;
top: 0;
left: 0;
padding-left: 1rem;
border-bottom:2px solid #666666;
font-size:14px;
}
.price_sorting{
padding: 0 2rem;
border-left: 1px solid #ddd;
float: left;
margin-left: 5.6rem;
font-size:14px;
}
.sorting_div{
float: right;
height: 1.4rem;
width: 0.9rem;
margin-left: 0.5rem;
margin-top: 0.3rem;
}
.sorting_icon{
float:left;
width:100%;
height:40%;
}
.sorting_div .sorting_icon:first-child{
margin-bottom:10%;
}
.icon_top{
background:url("../images/trade/icon_jiage_up_n@3x.png") no-repeat center center;
background-size:100% 100%;
}
.icon_top.active{
background:url("../images/trade/icon_jiage_up@3x.png") no-repeat center center;
background-size:100% 100%;
}
.icon_bottom{
background:url("../images/trade/icon_jiage_n@3x.png") no-repeat center center;
background-size:100% 100%;
}
.icon_bottom.active{
background:url("../images/trade/icon_jiage_down@3x(1).png") no-repeat center center;
background-size:100% 100%;
}
.serch_go{
position: absolute;
right: 1rem;
top: 0.5rem;
padding: 0.3rem 2.6rem 0.3rem 0.5rem;
border-radius: 1rem;
border: 1px solid #dbdbdb;
color: #bab9be;
font-size:12px;
}
.icon_search{
position: absolute;
height: 1.1rem;
width: 1.1rem;
right: 1rem;
bottom: 0.5rem;
background:url("../images/trade/icon_search_n@3x.png") no-repeat center center;
background-size:100% 100%;
}
.col_17{
color:#171717;
}
.shortcut .trade_topul{
margin-bottom:0;
background-color:#fff;
width:100%;
}
.ul_fixed{
position: fixed;
top: 4.2rem;
left: 0px;
right: 0;
z-index: 10;
padding-bottom: 15px;
max-width: 640px;
}
.scroll2{
width:100%;
}
.div_fixed{
position:fixed;
top:7.6rem;
left:0px;
z-index:10;
padding-bottom:15px;
background-color:#fff;
border-top:8px solid rgb(238,238,238);
}
.no_data{
position:relative;
}
.nodata_content{
position: absolute;
top: 50%;
left: 50%;
margin-top: -4rem;
margin-left: -11rem;
width: 22rem;
height: 8rem;
text-align: center;
}
.nodata_img{
width:5rem;
height:5rem;
display:block;
margin:0 auto;
}
.nodata_txt{
height:3rem;
line-height:3rem;
}
/*搜索相关样式 begin!*/
.s_header{
position:fixed;
top:0;
left:0;right:0;
z-index:99;
width:100%;
height:3.7rem;
background-color:#fafafa;
border-bottom:3px solid #dedede;
max-width: 640px;
margin: 0 auto;
}
.s_wrap{
position:relative;
height:100%;
}
.s_searchbox{
height:100%;
margin-left:1.24rem;
margin-right:4.9rem;
}
.search_input{
/* background-color:#e7e7e7; */
/* border-radius:0.3rem; */
}
.cancle_box{
height:100%;
width:4.9rem;
position:absolute;
top:0;
font-size:1rem;
color:#5dbbef;
text-align:center;
right:0;
}
.table{
display: table;
width: 100%;
height: 100%;
border: 0;
border-spacing: 0;
border-collapse: collapse;
}
.s_iconbox{
height:100%;
width:3rem;
position:absolute;
top:0;
right:0;
display:block;
}
.s_searchbox .s_iconbox:first-child{
left:0;
}
.table-cell{
display:table-cell;
vertical-align:middle;
text-align:center;
position:relative;
}
.s_icon{
display:block;
width:1.3rem;
height:1.3rem;
margin-left: 0.8rem;
background:url("../images/trade/icon_search_n@3x.png") no-repeat center center;
background-size:100% 100%;
}
.s_icondel{
background:url("../images/trade/nav_search_delete.png");
background-size:100% 100%;
opacity:0;
visibility:hidden;
}
.s_iconbox.on .s_icondel{
opacity:1;
visibility:visible;
}
.s_inputgroup{
height:3rem;
background-color:#e7e7e7;
border-radius:0.3rem;
padding:0 3rem;
}
.s_txt{
height:100%;
width:100%;
background-color:transparent;
color:#2d2d2d;
}
/* 修改input placeholder的颜色 begin*/
input::-webkit-input-placeholder, textarea::-webkit-input-placeholder {
/* WebKit browsers */
color: #bab9be;
}
input:-moz-placeholder, textarea:-moz-placeholder {
/* Mozilla Firefox 4 to 18 */
color: #bab9be;
}
input::-moz-placeholder, textarea::-moz-placeholder {
/* Mozilla Firefox 19+ */
color: #bab9be;
}
input:-ms-input-placeholder, textarea:-ms-input-placeholder {
/* Internet Explorer 10+ */
color: #bab9be;
}
/*end 修改input placeholder的颜色 */
.trunker{
margin-top:3.7rem;
}
.s_inner {
position: relative;
margin: 0 auto;
max-width: 1200px;
}
.default_list{
padding:0 1.34rem;
}
.new_recommend {
padding: 1.8rem 0;
border-bottom:2px solid #ededed;
}
.recommend_tit{
position:relative;
color:#a1a1a1;
font-size:1.5rem;
}
.search_change{
position:absolute;
top:0;
right:0;
}
.icon_change{
position:absolute;
height:1.3rem;
width:1.3rem;
background:url("../images/trade/search_batch.png") no-repeat center center;
background-size:100% 100%;
margin-left: -1.6rem;
margin-top: 0.2rem;
}
.recommend_content{
padding-top:2.3rem;
}
/*swiper 相关样式 begin!*/
.swiper-container {
margin:0 auto;
position:relative;
z-index:1;
overflow:hidden;
}
/*end! swiper 相关样式*/
.slider_item{
width:96%;
margin:0 auto;
}
.a_img{
display:block;
height:5.8rem;
width:5.8rem;
margin:0 auto;
}
.a_txt{
display:block;
width:100%;
text-align:center;
font-size:1.42rem;
color:#545454;
margin-top:0.8rem;
}
.search_history{
padding:1.8rem 0;
}
.history_content{
padding:1.7rem 0;
}
.history_btn{
float:left;
padding:0.8rem 0.7rem;
background-color:#f4f4f4;
color:#414141;
border-radius:5px;
margin-bottom:1rem;
margin-left:1rem;
}
.hasdata_ul{
}
.hasdata_li{
width:100%;
height:3.4rem;
border-bottom:2px solid #fbfbfb;
}
.hasdata_a{
display:block;
height:100%;
width:100%;
padding:1rem 1.1rem 1.1rem;
position:relative;
}
.search_litit{
color:#2d2d2d;
}
.discount{
color:#9e9e9e;
position:absolute;
right:1.1rem;
}
.icon_empty{
position:absolute;
height:1.3rem;
width:1rem;
background:url("../images/trade/icon_qingkong@3x.png") no-repeat center center;
background-size:100% 100%;
margin-left: -1.6rem;
margin-top: 0.2rem;
}
/*end! 搜索相关样式*/
/* 交易页商品详情 begin!*/
.gd-t-list .pad_b0{
padding-bottom:0;
}
.buyer_reader{
position: absolute;
right: 1.5rem;
top: 50%;
margin-top: -1.2rem;
padding: .4rem .58rem;
color:#23bbf3;
font-size:1.5rem;
}
.go_back{
position:absolute;
left:0;
height:100%;
width:6rem;
}
.img_goback{
height:1.5rem;
width:1rem;
}
.xg_main{
margin-top:4.3rem;
background-color:#fff;
}
.xg_version{
padding: 1.3rem 0;
height: 6.7rem;
}
.a_version{
height:4rem;
width:4rem;
border-radius:0.8rem;
overflow:hidden;
display:block;
}
.img_version{
}
.meader_txt{
}
.meader_txt span{
}
.meader_txt span:not(:first-child):before{
content:"";
display:inline-block;
width:1px;
height:100%;
background-color:#ddd;
}
.a_download{
display:block;
width:3.9rem;
height:3.9rem;
line-height:3.9rem;
border-radius:50%;
border:1px solid #ececec;
color:#23bbf3;
text-align:center;
}
.border_div{
margin-left:-1.5rem;
margin-right:-1.5rem;
height:0.5rem;
background-color:#eee;
}
.trumpt{
padding: 1.3rem 0;
}
.trumpt_top{
margin-bottom:1.3rem;
}
.trumpt_tl{
float:left;
width:75%;
}
.trumpt_tr{
float:right;
width:25%;
text-align: center;
}
.trumpt_botm{
position:relative;
padding: 1.35rem 0 0;
}
.trump_des{
color:#8d8d8d;
}
.trump_abtn{
position: absolute;
right: 0;
top: 50%;
margin-top: -0.5rem;
padding: 0.3rem 0.5rem;
border-radius: 1rem;
color: #2f8def;
border: 1px solid currentColor;
}
.tl_t_tit{
color:#949494;
font-size:1.5rem;
}
.span_des{
color:#333;
font-size:1.5rem;
}
.trump_line{
height:2rem;
line-height:2rem;
}
.border_div1{
margin-left:-1.5rem;
margin-right:-1.5rem;
height:0.1rem;
background-color:#eee;
}
.price{
color: #626262;
font-size: 1.5rem;
}
.price_num{
color:#d94132;
font-size:1.7rem;
}
.screenshot{
padding:1.6rem 0 0;
}
.screenshot_h{
color:#333;
font-size:1.7rem;
margin-bottom:1.6rem;
}
.font_h{
color:#333;
font-size:1.7rem;
margin-bottom:0.4rem;
}
.screenshot_p{
margin-bottom:0.8rem;
}
.confirm_btn{
display:block;
width:80%;
height:3rem;
line-height:3rem;
background-color:#24bbf4;
color:#fff;
margin:0 auto;
border-radius:20px;
}
.p_img{
margin-bottom:1.5rem;
}
.p_img:last-child{
margin-bottom: 6rem;
}
/* 买家必读遮罩层样式 begin! */
.xg_mask{
position: fixed;
top: 0;
/* left: 0; */
width: 100%;
height: 100%;
background-color: rgba(0,0,0,.4);
z-index: 99;
max-width: 640px;
margin: 0 auto;
}
.mast_read{
width:88%;
/* min-height:84%; */
background:#fff;
margin:0 auto;
border-radius:10px;
}
.read_toptit{
font-size:2rem;
padding:1.4rem;
background:url("../images/trade/bg@3x.png") no-repeat top left;
background-size:100% 100%;
color:#fff;
border-top-left-radius:10px;
border-top-right-radius:10px;
height: 4.7rem;
}
.read_main{
padding:1.85rem 1.8rem 1.6rem;
/* min-height: 38.6rem; */
box-sizing: border-box;
}
.h_tit{
width:100%;
text-align:left;
font-size:2rem;
color:#343434;
}
.flow_img{
width:100%;
height:8rem;
margin-top:1rem;
margin-bottom:3.4rem;
}
@media screen and (min-width: 768px) {
.flow_img {
height:13rem;
}
}
.instruct{
width: 100%;
margin-top: 1.5rem;
text-align: left;
}
.intruct_tab{
width:100%;
}
.intruct_tab tr td:first-child{
width:2rem;
vertical-align:top;
}
.intruct_tab tr td:not:(first-child){
color:#717171;
}
.instruct_num{
display:inline-block;
width:1.33rem;
height:1.33rem;
line-height:1.33rem;
color:#fff;
background-color:#999;
border-radius:50%;
text-align:center; font-size: 1rem;
}
/*美化复选框 begin!*/
.label_control input[type="checkbox"]{
position:absolute;
clip:rect(0,0,0,0);
}
.label_control{
float:left;
margin-left:0.6rem;
font-size:0;
line-height:2rem;
cursor:pointer;
color:;
}
.label_icon{
float: left;
width: 1.2rem;
height: 1.2rem;
margin-top:0.4rem;
margin-right: 4px;
background-position: center center;
background-repeat: no-repeat;
background-size:100%;
}
.label_txt{
overflow: hidden;
display: block;
font-size: 1.2rem;
color:#343434;
}
.label_control input[type="checkbox"] + .label_icon{
background-image:url('../images/trade/icon_weixuan_n.png');
}
.label_control input[type="checkbox"]:checked + .label_icon{
background-image:url('../images/trade/icon_xuanzhong_s.png');
}
/*end! 美化复选框*/
.readed{
width:100%;
margin-top:0.6rem;
}
.remember_btn{
display:block;
width:10rem;
height:2.9rem;
line-height:2.9rem;
margin:0 auto;
color:#fff;
background-color:#00b4ef;
border-radius:20px;
}
/*end! 买家必读遮罩层样式 */
/*购买成功 页面 begin!*/
.content_success{
background-color:#f2f2f2;
padding:1rem 1.15rem 2rem;
}
.success_div{
background-color:#fff;
width: 27.8rem;
height: 36.8rem;
border-radius:16px;
position:relative;
padding:2.6rem;
margin:0 auto;
}
.tip_div{
height:13rem;
width:88%;
position:absolute;
top:50%;
left:50%;
margin-top:-6.5rem;
margin-left:-44%;
text-align:center;
}
.tip_tith{
font-size: 1.5rem;
color: #000;
margin-bottom: 0.8em;
}
.tip_txtp{
font-size:1rem;
}
.success_img{
height:3.6rem;
width:3.6rem;
margin-bottom:1rem;
}
.s_download{
margin-top:3rem;
margin-bottom:1.5rem;
font-size:2rem;
}
.to_back{
color:#4e9fde;
font-size:1.5rem;
}
/*end! 购买成功 页面*/
/* 成交动态 begin! */
.deal_data{
margin-bottom:.7rem;
color:#4498f1;
}
.deal_ml{
margin-left:1.16rem;
}
.deal_img{
width:9.4rem;
height:5.67rem;
}
/*end! 成交动态 */
.div_ftf{
position: fixed;
bottom: 0;
left: 0;
right: 0;
width: 100%;
z-index: 99;
padding: 1.2rem;
background-color: #f2f2f2;
max-width: 640px;
margin: 0 auto;
}
/*end! 交易页商品详情*/
.buysucc_div .succ_goback{
display: block;
position: absolute;
top: 0px;
left: 0px;
display: inline-block;
width: 3rem;
padding: 1.2rem;
}
.trade_topul img{
width: 53%;
}
.custom_media .media-body.ver_bot{
vertical-align: bottom;
}
.col_red{
color:red;
}
.txt_blue{
color:#19b1ea;
}
.audit_failed{
color:rgb(217, 65, 50);
margin-top: 0.3rem;
display: inline-block;
}
.failed_tips{
color: #999;
display: block;
margin-bottom: 0.6rem;
}
.custom_media .media-heading{
font-size:12px;
}
@media screen and (max-width: 450px) {
.trade_caption {
font-size: 1.9rem;
}
}
@media screen and (max-width: 350px) {
.trade_caption {
font-size: 1.8rem;
}
}