[class^="ico-"]{ display:inline-block; overflow:hidden; vertical-align:middle; background:url(http://ue3.17173cdn.com/a/dnf/zt/2015/week/m/img/b1.png) no-repeat}
.ico-home{ background-image:url(http://ue1.17173cdn.com/a/dnf/zt/2015/week/m/img/sprite-top.png); width:30px; height:30px; background-size:100%}
.ico-sign1{ background-image:url(http://ue1.17173cdn.com/a/dnf/zt/2015/week/m/img/sign1.png); width: 3.125rem; height:3.125rem; background-size:100%}
.ico-sign2{ background-image:url(http://ue2.17173cdn.com/a/dnf/zt/2015/week/m/img/sign2.png); width: 3.125rem; height:3.125rem; background-size:100%}
.ico-circle{ background-image:url(http://ue2.17173cdn.com/a/dnf/zt/2015/week/m/img/circle.png); width: 13px; height:13px; background-size:100%}
.ico-oppose{ width: 53px; height:51px; background-size:200%}
.ico-support{ width: 53px; height:51px; background-size:200%; background-position:0 -60px}
.ico-comment{ background-image:url(http://ue1.17173cdn.com/a/dnf/zt/2015/week/m/img/sprite-top.png); background-size:200%; width:15px; height: 15px; background-position:0 -35px; margin: 0.3125em 1em 0.5625em 0}

.comm-mod .mod-hd{ position: relative; z-index: 5; padding: 1rem 0}
.comm-mod .mod-hd .txt-box{ overflow: hidden; width: 12.5rem; margin: 0 auto; background: #fff; padding: 0 0.75rem}
.comm-mod .mod-hd [class^="ico-sign"]{ float: left; margin-right: 0.25rem}
.comm-mod .mod-hd .txt{ overflow: hidden; text-align:center;} 
.comm-mod .mod-hd .tit{ color: #ff7e00; font-size:1.5625rem; font-weight: bold; line-height: 1.52}
.comm-mod .mod-hd .tit-e{ color: #c0d1cb; font-size: 0.75rem; line-height: 1}
.comm-mod .mod-hd .line{ position: absolute; width: 100%; background: #ff7e00; height:2px; top:50%; margin-top: -1px; z-index: -1}

.strong{ font-weight: bold;}
.c-tx{ color: #ff7e00}

.wrap{ width: 100%; height: 100%; position: absolute; -webkit-background-size:cover; background-size:cover; background-repeat: no-repeat; background-position: center center; padding:0}

header{ background: #eaeaea; position: relative;}
header .tit{ color: #444; font-size: 1.125rem; text-align: center; line-height: 2.45}
header .logo{ position: absolute; left:0.3125rem; top:0.375rem; width: 3.75rem;}
header .logo img{ width: 100%}
header .home{ position: absolute; right: 0.625rem; top:0.4375rem;}

.top-box{ position: relative; display: block; color: #fff; font-size: 0.9375rem}
.top-box img{ width: 100%}
.top-box .line{ position: absolute; left: 0; top:0; width: 100%; background: #ff7e00; height: 0.75rem}
.top-box .num{ position: absolute; top:0; left:1.125rem; font-size: 1.4375rem; font-weight: bold; background: #ff7e00; line-height: 1.52; padding: 0 1.375rem; border-bottom-left-radius:0.75rem; border-bottom-right-radius: 0.75rem}
.top-box .detail{ position: absolute; width: 100%; left: 0; bottom: 0; background: rgba(0,0,0,0.7); padding: 0.1875rem 0}
.top-box .detail .tit{ display: block; line-height: 1.5; padding: 0 1.4375rem;}

.btn-gotop{display:none;position:fixed;bottom:-2em;left:50%;width:4em;height:4em;margin-left:-2em;background:rgba(0,0,0,0.6);border-radius:100%; z-index: 100}
.btn-gotop{overflow:hidden;text-align:center}
.btn-gotop::before{content:' ';display:inline-block}
.btn-gotop::after{content:' ';display:inline-block}
.btn-gotop::after{display:inline-block;position:relative;top:1em;width:.8em;height:.8em;border-left:.2em solid #a9abae;border-top:.2em solid #a9abae;-webkit-transform:rotate(45deg);-ms-transform:rotate(45deg);transform:rotate(45deg)}

.editor-box{ overflow: hidden; padding: 0 0.75rem 0 0.5rem}
.editor-box .pic-box{ float: left; width: 5rem; border-radius:100%; border:3px solid #ff7e00; }
.editor-box .pic-box img{ width: 100%; border-radius: 100%}
.editor-box .detail{ overflow: hidden; padding-left: 1.25rem; position: relative;}
.editor-box .detail-in{ background: #ff7e00; color: #fff; font-weight: bold; font-size: 0.9375rem; line-height: 1.46; padding: 0.7rem 0.75rem; border-radius:0.5rem; min-height: 5.375rem;}
.editor-box .detail-in::before{ content:' ';display:inline-block; position: absolute; overflow:hidden; width:0; height:0; font-size:0; border:0.75rem dashed transparent;  border-right-style:solid; border-right-color: #ff7e00; left:-0.25rem; top:1.9375rem}
.mod-editor .info{ padding: 0.625rem 1.5625rem 0; color: #181818; font-size: 0.9375rem; line-height: 1.67}
.mod-editor .info p{ padding-bottom: 1.25rem}

.mod-hot .mod-hd .txt-box{ width: 14.5rem}
.mod-hot .mod-bd{ padding: 1.25rem 0.625rem 0}
.list-hot{ background: url(http://ue3.17173cdn.com/a/dnf/zt/2015/week/m/img/bg1.png) 6px 0 repeat-y;}
.list-hot li{ padding-left: 1rem; position: relative; margin-top: 1.5rem}
.list-hot li:first-child{  margin-top: 0}
.list-hot li:first-child::before{ content:' ';display:inline-block; position: absolute; height: 0.3125rem; width: 1px; background: #fff; left: 6px; top:0;}
.list-hot .ico-circle{ position: absolute; left: 0; top:0.3125rem;}
.list-hot .title{ color: #ff7e00; font-weight: bold; font-size: 0; line-height: 1; border-bottom: 2px solid #ff7e00; position: relative; padding-bottom: 0.25rem; margin-bottom: 1rem; }
.list-hot .title::after{ content:' ';display:inline-block; position: absolute; border:0.4rem dashed transparent; border-top-style:solid; border-top-color: #ff7e00; left: 0.5rem; bottom: -0.8rem}
.list-hot .title .time{ display: inline-block; font-size: 1.5625rem;}
.list-hot .title .tit{ display: inline-block; font-size: 1.375rem; line-height: 1.136; border-left: 1px solid #ff7e00; padding-left: 0.5rem; margin-left: 0.5rem;}
.list-hot .link{ display: block; position: relative; color: #fff; margin-bottom: 0.625rem}
.list-hot .link img{ width: 100%}
.list-hot .link .detail{ position: absolute; width: 100%; left: 0; bottom: 0; background: rgba(0,0,0,.7);}
.list-hot .link .tit{ display: block; padding: 0.25rem 1.25rem 0.25rem 0.5rem; font-size:0.9375rem;line-height: 1.4}
.list-hot .info{ color: #4c4c4c; font-size: 0.9375rem;}
.list-hot .info p{ padding-top:1rem}
.list-hot .info p:first-child{ padding: 0}
.mod-pk{ padding-left: 6px; margin-top: 1rem}
.mod-pk .mod-hd{ padding: 0}
.mod-pk .mod-hd .tit{ color: #fff; font-weight: bold; font-size: 1.5625rem; background: #ff7e00; text-align: center; line-height:1.6}
.mod-pk .mod-bd{ background: #ececec; padding: 0}
.mod-pk .title{ font-weight: bold; color: #000; font-size: 1.125rem; position: relative; padding-left: 0.875rem; line-height: 2; margin:0 0.625rem 0.25rem}
.mod-pk .title::before{ content:' ';display:inline-block; position: absolute; border:0.4rem dashed transparent; border-left-style:solid; border-left-color: #000; left: 0; top: 0.75rem}
.mod-pk .info{ color: #444; font-size: 0.9375rem; line-height:1.9; padding-bottom: 1.875rem; margin:0 0.625rem}
.mod-pk .info .name{ color: #ff7e00; font-weight: bold; font-size: 1.25rem}
.pk-box{ padding-bottom: 0.625rem}
.pk-box .box-c1{ position: relative; height: 6rem; margin-bottom: 0.625rem}
.pk-box .box-c1 .tit{ text-align: center; font-size: 2.1875rem; font-weight: bold; color: #0072ff; line-height: 2.75}
.pk-box [class^="btn-"]{ position: absolute; top:0; background: #ff7e00; width: 42%; text-align: center; line-height: 1; padding-top:0.46rem; height: 6rem}
.pk-box .box-c1 .txt{ color: #fff; font-weight: bold; font-size: 1.5625rem; padding-top: 0.3125rem}
.pk-box [class^="btn-"]::after{ content:' ';display:inline-block; position: absolute; overflow:hidden; width:0; height:0; font-size:0; border:3rem dashed transparent; border-width:3rem 0.9rem; border-top-style:solid; border-top-color: #ececec; top:0;}
.pk-box .btn-oppose{ left: 0; padding-right: 1.8rem}
.pk-box .btn-oppose::after{ border-right-style:solid; border-right-color: #ececec; right: 0}
.pk-box .btn-support{ right: 0; padding-left: 1.8rem; background: #0072ff}
.pk-box .btn-support::after{ border-left-style:solid; border-left-color: #ececec; left: 0}
.pk-box .box-c2{ height: 3.75rem; position: relative;}
.pk-box [class^="vote-"]{ width: 3.75rem; height: 3.75rem; border-radius: 100%; position: absolute; top:0; color: #fff; text-align: center; font-size:1.25rem; font-weight: bold; line-height: 3}
.pk-box .vote-opp{ background: #ff7e00; left: 0}
.pk-box .vote-sup{ background: #0072ff; right: 0}
.pk-box .bar{ height: 1.25rem; margin:0 3.65rem; background: #0072ff; position: relative; top:1.25rem;}
.pk-box .bar-in{ position: absolute; width: 50%; height: 1.25rem; background: #ff7e00}

.mod-comment .section-title-b{ background: #fff;}
.mod-comment .section-cbox-b{ background: #fff;}

.link-comment-box{ text-align: center; padding: 0.5rem 0}
.link-comment-box a{ color: #363636; font-size: 1rem; display: inline-block; line-height: 2}

.footer { position:relative; padding:1em 0 2.5em; background-color:#888888}
.mod-platform { margin-bottom:0.5rem; text-align:center }
.mod-platform a { color:#fff }
.mod-platform a:first-child { margin-right:2em }
.copyright {font-size:.75rem; color:#b9b9b9; text-align:center }
.copyright a { color:#c0c0c0 }
.btn-gotop { display:none; position:fixed; bottom:-2em; left:50%; width:4em; height:4em; margin-left:-2em; background:rgba(0, 0, 0, 0.6); border-radius:100% ; z-index:100;text-align: center;}
.btn-gotop::after{ display:inline-block; position:relative; content: ''; top:1em; width:.8em;
height:.8em; border-left:.2em solid #a9abae; border-top:.2em solid #a9abae; -webkit-transform:rotate(45deg); -ms-transform:rotate(45deg);transform:rotate(45deg)}
.footer-ico-pc, .footer-ico-mobile{ display:inline-block; overflow:hidden;vertical-align:middle;background:url(http://ue3.17173cdn.com/a/dnf/zt/2015/week/m/img/footer-ico.png) no-repeat}
.footer-ico-pc{ background-size:300%; width: 20px; height:15px; margin: 0.3125em 0.5625em 0.3125em 0}
.footer-ico-mobile{  background-size:400%; width: 15px; height:18px; background-position:0 -20px; margin: 0.125em 0.5em 0.375em 0}

@media only screen and (min-width: 360px){
	.comm-mod .mod-hd .txt-box{ width: 13rem}
	.mod-hot .mod-hd .txt-box{ width: 15rem; }
	.editor-box .detail-in::before{ left: -0.2rem}
}

/*the iPhone 4*/
@media only screen and (min-device-width: 320px) and (max-device-height: 480px){

} 

/*iPhone 5 and iPhone 5s*/
@media only screen and (min-device-width : 320px) and (max-device-width : 568px) {

} 


/*iPhone 6 and iPhone 6+*/
@media only screen and (min-device-width : 375px) and (max-device-width : 667px) {

}
@media only screen and (min-device-width : 414px) and (max-device-width : 736px) {

}


