/*web*/
html{ -webkit-text-size-adjust:100%;-ms-text-size-adjust: 100%;-webkit-text-size-adjust:none; }
body{ font-family:"Microsoft YaHei", Tahoma, SimSun; line-height:1; color:#666; font-size:14px;}
div,li{white-space: normal;word-wrap: break-word;word-break: break-all;}
input::-ms-clear {display: none;}
a:hover{outline:none; text-decoration:none;}
a{ text-decoration: none; outline:none;color:#666;-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-user-select: none;}
input,button,textarea,a{outline:none;-webkit-appearance: none;}

.test-box{ background-color:#C90; height:100px;}
.f-txtof{white-space:nowrap;text-overflow:ellipsis; overflow:hidden;word-break:keep-all;}
.f-of{overflow:hidden;}
.f-fl,.f-fr{*display:inline;}
.f-fl{ float:left;}
.f-fr{ float:right;}
.f-clear:after {visibility:hidden;display:block;font-size:0;content:" ";clear:both;height:0;}
.f-clear {zoom:1;}
.f-hide{ display:none;}
.f-show{ display:block;}
.f-txt_c{ text-align:center;}
.g-layout{ width:1200px; margin-left:auto; margin-right:auto;}


/*图标*/
i,.i-ico{ display:inline-block; vertical-align:middle; background:url(../img/dnf_ui.png) no-repeat;}

/*公用皮肤*/
.s-b_5c9bc5{ background-color:#5c9bc5;}
.s-f12{ font-size:12px;}
.s-c_999{color:#999;}
.s-c_000{color:#000;}
.s-c_ff6868{ color:#FF6868}
.s-blod{ font-weight:bold;}
.s-lh30{ line-height:30px;}
/*公用皮肤:end*/

/*公用布局*/
.g-mb10{ margin-bottom:10px;}
.g-mb10{ margin-bottom:10px;}
.g-mr20{ margin-right:20px;}
.g-mb20{ margin-bottom:20px;}
.g-ml10{ margin-left:10px;}

.s-f12{ font-size:12px;}
.s-c_b8b8b8{color:#b8b8b8;}
/*公用布局:end*/



html{ background:url(../img/bg.png) center center ;height:100%; -webkit-overflow-scrolling: touch;min-width:300px;}

.m-main{background-color:rgba(255,255,255,0.7); filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#b3ffffff,endColorstr=#b3ffffff);padding:20px;   border-bottom:3px solid #6CB7FB; box-shadow:0px 0px 5px #666; display: none; }
/*-DNF弹窗-*/
.m-alert_box{ min-width:160px; max-width:320px; background:url(../img/alert/4.png) repeat; position:fixed; left:50%; margin-left:-80px; top:-100%;}
.m-alert_box  .i-angle{ position:absolute;  display:block; width:11px; height:11px;}
.m-alert_box  .i-angle.s-left_top{ left:-11px ; top:-11px; background:url(../img/alert/0.png) no-repeat;}
.m-alert_box  .i-angle.s-right_top{ right:-11px ; top:-11px; background:url(../img/alert/2.png) no-repeat;}
.m-alert_box  .i-angle.s-left_bottom{ left:-11px ; bottom:-11px;background:url(../img/alert/6.png) no-repeat;}
.m-alert_box  .i-angle.s-right_bottom{ right:-11px ; bottom:-11px;background:url(../img/alert/8.png) no-repeat;}
.m-alert_box  .left_border{width:11px; background:url(../img/alert/3.png) repeat-y; position:absolute; left:-11px; top:0; height:100%;}
.m-alert_box  .right_border{width:11px; background:url(../img/alert/5.png) repeat-y; position:absolute; right:-11px; top:0; height:100%;}
.m-alert_box  .top_border{width:100%; background:url(../img/alert/1.png) repeat-x; position:absolute; top:-11px; left:0; height:11px;}
.m-alert_box  .bottom_border{width:100%; background:url(../img/alert/7.png) repeat-x; position:absolute; bottom:-11px; left:0; height:11px;}

.m-alert_box	.title_left{ width:24px; height:26px; position:absolute; left:-12px; top:-22px; background:url(../img/alert/94.png) no-repeat;}
.m-alert_box	.title_right{width:24px; height:26px; position:absolute; right:-12px; top:-22px; background:url(../img/alert/96.png) no-repeat;}
.m-alert_box .title_mid{background:url(../img/alert/95.png) repeat-x;width:136px; height:26px; position:absolute; top:-22px; left:12px; }
.m-alert_box .title{ height:26px; line-height:26px; text-align:center; width:100%; padding:0 12px; position:absolute; top:-22px; left:-12px; font-size:12px;color:#fff; font-family:SimSun; cursor:pointer;-webkit-user-select:none; -moz-user-select:none; z-index:10;}

.m-alert_box	.focus_left{ width:18px; height:15px; position:absolute; left:-6px; top:-17px; background:url(../img/alert/106.png) no-repeat; z-index:5; }
.m-alert_box	.focus_right{ width:18px; height:15px; position:absolute; right:-6px; top:-17px; background:url(../img/alert/108.png) no-repeat; z-index:5;}
.m-alert_box	.focus_mid{width:136px; height:15px;position:absolute; left:12px; top:-17px; background:url(../img/alert/107.png) repeat-x;z-index:5;}


.m-alert_box .ct{ font-size:12px; line-height:16px; color:#fff; font-family:SimSun;  padding:20px 10px 15px 10px;}


.u-btn{ display:inline-block; height:23px; line-height:23px; position:relative; background:url(../img/button/173.png) repeat-x; font-size:12px;color:#DDC593; text-align:center; font-family:SimSun; padding:0 28px;}
.u-btn > i.left,.u-btn > i.right{ width:28px; height:23px; position:absolute; top:0;}
.u-btn > i.left{ background:url(../img/button/172.png) no-repeat; left:0;}
.u-btn > i.right{background:url(../img/button/174.png) no-repeat; right:0;}

.u-btn:hover{ text-decoration:none; background:url(../img/button/176.png) repeat-x;color:#FFFFB8;}
.u-btn:hover > i.left{background:url(../img/button/175.png) no-repeat;}
.u-btn:hover  > i.right{background:url(../img/button/177.png) no-repeat;}

.u-btn:active{ text-decoration:none; background:url(../img/button/179.png) repeat-x;color:#FFFFB8;}
.u-btn:active > i.left{background:url(../img/button/178.png) no-repeat;}
.u-btn:active  > i.right{background:url(../img/button/180.png) no-repeat;}

.u-close{ display:block; position:absolute; width:10px; height:9px; background-position:-7px -21px; top:-13px;right:-3px;z-index:11;}	
.u-close:hover{ background-position:-7px -8px;}
.u-close:active{ background-position:-7px -35px;}


.u-btn2{ cursor: pointer; display:inline-block; width:56px; height:23px; line-height:23px; text-align:center; background-position:0 -116px; font-size:12px; color:#DDC593; text-shadow:1px 1px 1px #000; font-family:SimSun;}
.u-btn2:hover,.u-btn2:focus{ background-position:0 -142px; text-decoration:none;color:#FFFFB8; }
.u-btn2:active{ background-position:0 -168px;color:#FFFFB8;}

.u-btn3{ overflow:hidden; font-weight:normal; display:inline-block; width:77px; height:23px; line-height:23px; text-align:center; background-position:-75px -116px; font-size:12px; color:#DDC593; text-shadow:1px 1px 1px #000; font-family:SimSun; }
.u-btn3:hover , .u-btn3:focus { background-position:-75px  -142px; text-decoration:none;color:#FFFFB8; }
.u-btn3:active{ background-position:-75px  -168px;color:#FFFFB8;}

.u-text{ border:1px solid #94835a; border-radius:3px; height:21px; line-height:21px \9; font-size:12px; padding:0 10px; width:50px;}
.u-title{ font-size:24px; text-align:center; color:#333; font-weight:bold;}
.u-title > div{ font-size: 12px;color:#999; font-weight: normal; padding-top: 10px; }

.m-role_list{ padding:10px 0; margin-left:-25px;-webkit-overflow-scrolling: touch; }
.m-role_list li{ background-color:#fff; padding-left:10px ;padding-right:40px; width:150px; float:left; height:33px; line-height:33px;  border-left:3px solid #6CB7FB;  margin-bottom:5px;color:#333; position:relative; margin-left:25px; margin-bottom:15px;zoom:1; box-shadow:0 0 3px #ccc;-webkit-animation:fadeInLeft .4s ease .1s  both; animation:fadeInLeft .4s ease .1s  both;-ms-animation:fadeInLeft .4s ease .1s  both;-moz-animation:fadeInLeft .4s ease .1s  both; }
.m-role_list li div{ height:33px; line-height:33px;}
.m-role_list li  .rolename{ line-height:30px;}

.m-role_list li:after {visibility:hidden;display:block;font-size:0;content:" ";clear:both;height:0;}
.m-role_list li:hover{ background-color:#FAFAFA; border-left-color:#C4E8FB;}
.m-role_list li .nun{ color:#000; font-weight:bold;  display:inline-block; width:24px;}
.m-role_list li .lv_num{ font-weight:bold;color:#EA4D00;}
.m-role_list li .j-remove{ position:absolute; right:0; top:0; display:block; width:26px; height:33px; line-height:33px; font-size:26px; text-align:center; font-family:Arial; background:none; background-color:#CCC; cursor:pointer; -webkit-user-select:none; -moz-user-select:none;}
.m-role_list li .j-remove{ background-color:#FF6868;color:#fff;}

.m-radio{ display:inline-block; *zoom:1; height:16px; font-size:14px; line-height:16px; cursor:pointer;}
.m-radio >i{ width:16px; height:15px; background-position:-29px -241px; vertical-align:top; margin-right:5px;}
.m-radio:hover >i{ background-position:-29px -256px;}
.m-radio.z-current >i{ background-position:-29px -286px;}

.m-up_percent{ height:20px; background-color:#EBEBEB; margin-bottom:10px; border:1px solid #ccc; border-radius:20px; overflow:hidden; position:relative;}
.m-up_percent > .val{ height:20px; background-color:#9FCEEF; border-radius:20px; -webkit-transition:all 0.3s linear; -ms-transition:all 0.3s linear; -moz-transition:all 0.3s linear;}
.m-up_percent > .txt{ position:absolute; height:20px; line-height:20px; text-align:center; width:100%; font-size:12px;color:#333;}


.m-share{ text-align:center; background-color:#fff; padding:10px;}
.m-share > a{ display:inline-block; *display:inline; *zoom:1; width:32px; height:32px; margin-left:10px;}
.m-share > a:first-child{ margin-left:0;}
.m-share > a.weibo{ background:url(../img/share/weibo.jpg) center center no-repeat; background-size:32px 32px;}
.m-share > a.tweibo{ background:url(../img/share/tweibo.jpg) center center no-repeat; background-size:32px 32px;}
.m-share > a.qzone{ background:url(../img/share/qzone.jpg) center center no-repeat; background-size:32px 32px;}


/*- 计算界面 -*/
.m-calcu{ width: 100%; background-color: #fafafa; box-shadow: 0 0 8px rgba(0,0,0,0.15);}
.m-calcu th , .m-calcu td{ padding: 16px 10px;  border:1px solid #ddd; position: relative; text-align: center;color:#000;}
.m-calcu th{ font-weight: bold; }
.m-calcu .u-text{ width: auto;  }
.m-calcu .u-text + div{ padding-top: 5px;font-size: 12px; color:#333; }
.m-calcu td .ab{ padding-top: 5px; font-size: 12px; color:#666; }



.a-FU_fadeInT{-webkit-animation:FU_fadeInT .6s ease both;-moz-animation:FU_fadeInT .6s ease both;-ms-animation:FU_fadeInT .6s ease both;animation:FU_fadeInT .6s ease both}
;
@-webkit-keyframes FU_fadeInT{
	0%{opacity:0;-webkit-transform:translateY(-20%)}
	100%{opacity:1;-webkit-transform:translateY(0)}
}
@-moz-keyframes FU_fadeInT{
	0%{opacity:0;-moz-transform:translateY(-20%)}
	100%{opacity:1;-moz-transform:translateY(0)}
}
@-ms-keyframes FU_fadeInT{
	0%{opacity:0;-ms-transform:translateY(-20%)}
	100%{opacity:1;-ms-transform:translateY(0)}
}
@keyframes FU_fadeInT{
	0%{opacity:0;transform:translateY(-20%)}
	100%{opacity:1;transform:translateY(0)}
}