<extend name="Public/tradebases" />
<block name="css">
<link rel="stylesheet" href="__CSS__/xg_common.css">
<style>
body {background-image:none;background:#FFF;}
.header-btn .trade_caption {color:#FFF;}
.trade-notice-header {height:auto;background:url(__IMG__/trade/bg@3x.png) top center no-repeat;background-size:100% 100%;color:#FFF;}
.trade_notice_top {padding:0.2rem 0.4rem 0.8rem;}
.trade_notice_top p {line-height:1.4;text-indent:2em;color:#FFF}
.mask-body{padding: 0rem .4rem .6rem;}
.mask-body dt{
		font-size: 0.42rem;
		color: #343434;
		margin-bottom: 0.4rem;font-weight:700;
}

.mask-body dd{
		font-size: 0.38rem;
		color: #717171;
		margin: 0rem;
}
.mask-body .notice dd{
		counter-increment: item;
}

.mask-body .notice dd::before{
		content: counter(item);
		display: inline-block;
		width: 0.46rem;
		height: 0.46rem;
		line-height: 0.46rem;
		border-radius: 100%;
		font-size: 0.35rem;
		color: #fff;
		text-align: center;
		background-color: #999;
		margin-right: 0.16rem;
}

.purchase_process .xg-table {
            width: 100%;
            table-layout: fixed;
            margin-bottom: .8rem;
        }

        .purchase_process .xg-table td{
            text-align: center;
            vertical-align: middle;
            border: none;
            position: relative;
        }
        .purchase_process .process-flag{
            display: block;
            width: 0.5rem;
            height: 0.5rem;
            margin: 0 auto;
            background-color: currentColor;
            background-clip: content-box;
            padding: 2px;
            border:1px solid currentColor;
            color: #4f90f5;
            border-radius: 100%;
            text-indent: -99rem;
            z-index: 2;
            box-sizing: border-box;
        }
        .purchase_process  .process-flag:before,
        .purchase_process .process-flag:after{
            content: '';
            position: absolute;
            top:50%;
            border-top:1px dashed currentColor;
            z-index: 0;
        }
        .purchase_process .process-flag:before{
            left: 0px;
            right: 50%;
            margin-right: 0.25rem;
        }
        .purchase_process .process-flag:after{
            left: 50%;
            right: 2px;
            margin-left: 0.25rem;
        }
        .purchase_process .process-flag.first:before{
             display: none;
         }
        .purchase_process .process-flag.last:after{
            display: none;
        }
        .purchase_process .xg-image {
            display: inline-block;
            width: 1.2rem;
            height: auto;
            margin-top: 0.5rem;
            margin-bottom: 0.28rem;
        }
        .purchase_process .xg-text{
            font-size: 0.38rem;
            color: #4b4b4b;
            padding: 0 0.1rem;
        }


.read_main{
	padding:0rem .4rem .6rem;
	min-height:9.8rem;
  box-sizing: border-box;border-bottom:.1rem solid #eee
}
.h_tit{
	width:100%;
	text-align:left;
	font-size:.42rem;
	color:#343434;margin:0.4rem 0 0.2rem;
}
.flow_img{
	width:100%;
	height:2.5rem;
	margin-top:.2rem;
	margin-bottom:.4rem;
}
.instruct{
	width: 100%;
    margin-top: .2rem;
    text-align: left;
}
.intruct_tab{
	 width:100%;
}
.intruct_tab tr td:first-child{
	width:.6rem;
	vertical-align:top;
}
.intruct_tab tr td:not:(first-child){
	color:#717171;
}
.instruct_num{
	display:inline-block;
	width:.4rem;
	height:.4rem;
	line-height:.4rem;
	color:#fff;
	background-color:#999;
	border-radius:50%;
	text-align:center;font-size:.3rem;
}

.confirm_btn.disabled {background:#bbb} .xgdisabled {background:#c1c3c1;}
.h_tit {font-weight:normal;}
.intruct_tab tr td:first-child {display:none;}
.intruct_tab tr {counter-increment: item;}
.intruct_tab p:before{
	content: counter(item);
	display: inline-block;
	width: .45rem;
	height: .45rem;
	line-height: .45rem;
	border-radius: 100%;
	font-size: .22rem;
	color: #fff;
	text-align: center;
	background-color: #999;
	margin-right: 0.2rem;
}
.mast_read {width:90%;}
.trade_notice_space {height:3.1rem;}
.xg-main {padding-top:1px;background:#FFF;}
.read_main,.mask-body {background:#FFF;}
@media screen and (min-width:640px) {
	.h_tit {font-size:.4rem;}
	.intruct_tab p{font-size:.34rem;line-height:1.444;margin-bottom:0.1rem;}
	.read_toptit {padding:2rem;font-size:2.8rem;height:auto;}
	.intruct_tab p:before {font-size:.34rem;}
	.label_txt {font-size:1.5rem;}
	.readed {margin-top:1rem;}
	.remember_btn {height:3.6rem;line-height:3.6rem;font-size:2.2rem;width:50%;margin-top:2.8rem;}
	.flow_img {height:2.7rem;}
	.trade_notice_top p {font-size:0.28rem;}
	.purchase_process .xg-text {font-size:0.34rem;}
	.purchase_process .xg-image {margin-top:0.4rem;margin-bottom:0.05rem;}
	purchase_process {margin-bottom:0;}
	.trade_notice_space {height:2.9rem;}
}


</style>
</block>
<block name="body" >
<script src="__JS__/xg_mobile.js"></script>
<header class="header trade-header header-btn trade-notice-header" >
    <a class="xg-back" id="jstradenoticebox" href="javascript:history.back(-1);"></a>
    <h1 class="xg-title trade_caption">交易须知</h1>
		<div class="trade_notice_top">
			<p>账号交易采用转移小号的方式；买入或者卖出游戏角色，不影响您的平台账号使用。</p>
		</div>
</header>
<div class="trade_notice_space">&nbsp;</div>
<main class="xg-main wrapper" style="position:relative;top:0;">
    <div class="">
			<div class="read_main">
				<h4 class="h_tit">购买流程</h4>
				<p style="width:90%;margin:0 auto;">
					<img class="flow_img" src="__IMG__/trade/icon_maijia@3x.png" alt="" height="" width="">
				</p>
				<h4 class="h_tit">买家须知</h4>
				<div class="instruct">
					<table class="intruct_tab">
						<tbody>
							<tr>
								<td><span class="instruct_num">1</span></td>
								<td>
									<p>角色信息已通过本平台审核，因时间因素造成排行榜，称号，装备，到期等变化，不视为信息失实；</p>
								</td>
							</tr>
							<tr>
								<td><span class="instruct_num">2</span></td>
								<td>
									<p>购买后，角色小号自动转入你的平台账号内，重新登录游戏【选择小号】处查收即可；</p>
								</td>
							</tr>
							<tr>
								<td><span class="instruct_num">3</span></td>
								<td>
									<p>交易过程仅限小号转移，不存在游戏账号交易或换绑行为，无需担心角色找回；</p>
								</td>
							</tr>
							<tr>
								<td><span class="instruct_num">4</span></td>
								<td>
									<p>交易完成后，不支持退货！</p>
								</td>
							</tr>
						</tbody>
					</table>
				</div>
			</div>
			
			<div class="mask-body ">
            <dl>
                <dt><h4 class="h_tit">出售流程</h4></dt>
                <dd class="purchase_process ">
                    <table class="xg-table" border="0" cellpadding="0" cellspacing="0">
                        <tr>
                            <td><span class="process-flag first">1</span></td>
                            <td><span class="process-flag">2</span></td>
                            <td><span class="process-flag">3</span></td>
                            <td><span class="process-flag last">4</span></td>
                        </tr>
                        <tr>
                            <td><img class="xg-image" src="__IMG__/trade1/icon_normal_tijiao.png" width="180" height="" alt="">
                                <p class="xg-text">提交商品</p>
                            </td>
                            <td><img class="xg-image" src="__IMG__/trade1/icon_normal_shenhe.png" width="180" height="180" alt="">
                                <p class="xg-text">审核冻结</p>
                            </td>
                            <td><img class="xg-image" src="__IMG__/trade1/icon_normal_maijia.png" width="180" height="180" alt="">
                                <p class="xg-text">买家购买</p>
                            </td>
                            <td><img class="xg-image" src="__IMG__/trade1/icon_normal_huoyi.png" width="180" height="180" alt="">
                                <p class="xg-text">获得收益</p>
                            </td>
                        </tr>
                    </table>
                </dd>
            </dl>
						<h4 class="h_tit">卖家须知</h4>
						<div class="instruct">
							<table class="intruct_tab">
								<tbody>
									<tr>
										<td><span class="instruct_num">1</span></td>
										<td>
											<p>提交出售申请后，审核人员会冻结待售小号，无法登录；</p>
										</td>
									</tr>
									<tr>
										<td><span class="instruct_num">2</span></td>
										<td>
											<p>若审核不通过，或者您选择下架商品，可重新登录游戏获得小号；</p>
										</td>
									</tr>
									<tr>
										<td><span class="instruct_num">3</span></td>
										<td>
											<p>若小号出售成功，则该小号在游戏中所有区服的角色将会一起出售；</p>
										</td>
									</tr>
									<tr>
										<td><span class="instruct_num">4</span></td>
										<td>
											<p>出售成功将收取{:set_zero_on_number(C('withdraw.sell_rate'))}%手续费(最低{:set_zero_on_number(C('withdraw.poundage'))}元)，剩余收益以金币形式发送至您的账号内；</p>
										</td>
									</tr>
									<tr>
										<td><span class="instruct_num">5</span></td>
										<td>
											<p>交易完成后，不支持找回。</p>
										</td>
									</tr>
								</tbody>
							</table>
						</div>
        </div>
			
			
		</div>
</main>
</block>