/*the global*/
body{font-size:12px;  font-family: "Microsoft Yahei"; letter-spacing:0px; min-width:1000px;}
a:focus,a:active,a:hover{ outline:none}

.global-footer{ color:#666; background:url(//ue.17173cdn.com/a/cf/zt/2015/ynhd/img/area3.png) repeat;}
.global-footer a:link, .global-footer a:visited, .global-footer a:hover, .global-footer a:active{ color:#666;}

.ico, .bt-signin{ display:inline-block; vertical-align:middle; background:url(//ue.17173cdn.com/a/cf/zt/2015/ynhd/img/sprite.png) no-repeat;}
.ico-num1, .ico-num2, .ico-num3{ width: 75px; height: 75px;}
.ico-num1{ background-position: 0 -240px;}
.ico-num2{ background-position: -100px -240px;}
.ico-num3{ background-position: -200px -240px;}

.ico-tit1, .ico-tit2{ width: 36px; height: 42px; margin:0 15px 3px 0;}
.ico-tit1{ background-position: -320px -240px;}
.ico-tit2{ background-position: -370px -240px;}

.bt{ display: inline-block; vertical-align: middle; height: 28px; line-height: 28px; font-size: 16px; color:#fff; background: #ce1e1e; padding:0 25px; text-indent: 0;}
.bt:hover{ background: #ec3333;}

.bt-signin{ width: 145px; height: 57px; padding:90px 0 0 0; background-position: -160px -80px; text-align: center; font-size: 25px; color:#fff; font-weight: bold;}
.bt-signin:hover{ background-position: 0 -80px;}

.c-tx1,.c-tx1:hover{color: #fff;}
.c-tx2,.c-tx2:hover{color: #999;}
.c-tx3,.c-tx3:hover{color: #333;}
.c-tx3:hover{text-decoration:underline}
.dsb{display: block;text-align: left;font-size: 14px; line-height: 24px;}

.comm-txt{ font-size: 16px; color:#b5b5b5; line-height: 1.875}
.comm-txt-ex{text-indent: 2em;}

.comm-tlist li{ font-size: 14px; color:#b5b5b5; line-height: 30px}
.comm-tlist-ex li{ font-size: 16px;}
.comm-tlist-ex li .num{ float: left; width: 17px; height: 17px; text-align: center; line-height: 17px; background: #1f1f1f; color:#fff; font-size: 12px; margin:7px 8px 0 0;}

.ico-in{ display:block; background:url(//ue.17173cdn.com/a/cf/zt/2015/ynhd/img/sprite-png24.png) no-repeat; _background:none; _filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true,sizingMethod=crop,src='//ue.17173cdn.com/a/cf/zt/2015/ynhd/img/sprite-png24.png');}

.ico-video, .ico-video .ico-in{ display:block; width:45px; height:45px; overflow:hidden;}
.ico-video .ico-in{ background-position:0 0; _padding-top:0; _margin-top:0;}

.gb-list2{ overflow:hidden; *zoom:1; font-size:0}
.gb-list2-item{ display:inline-block; *display:inline; *zoom:1; text-align:center; vertical-align:top}
.gb-list2-con,.gb-list2-c2,.gb-list2 .txt,.gb-list2 .tit{ display:block; *zoom:1; overflow:hidden; cursor:pointer}
.gb-list2-con{ margin-left:auto; margin-right:auto}
*html .gb-list2-con:hover{ direction:ltr}
.gb-list2-c1{ display:block;}
.gb-list2 .avatar,.gb-list2-c2,.gb-list2-c3{ font-size:12px}
.gb-list2 .txt{ width:98%; margin-left:auto; margin-right:auto; text-overflow:ellipsis; vertical-align:baseline}
.gb-list2 .cover,.gb-list2 .mask{ display:block; overflow:hidden; position:absolute}
.gb-list2 .cover{ z-index:2}
.gb-list2 .mask{ z-index:-1; top:0; left:0; background:#000; filter:alpha(opacity:75); opacity:.75}
:root .gb-list2 .mask{ filter:none \0}
/*.gb-list2 .cover{ display:block; left:0; bottom:0; z-index:-1; background:url(http://ue3.17173cdn.com/a/v/lol/index/2014v2/img/sprite-png24.png) repeat-x 0 -80px;}*/
.gb-list2 .cover{ bottom: 0;left: 0; z-index:-1;
background: -webkit-linear-gradient(top,rgba(0,0,0,0) 1%,rgba(0,0,0,.3) 30%,rgba(0,0,0,.6) 50%,rgba(0,0,0,.8) 70%,rgba(0,0,0,1) 100%);
background: -moz-linear-gradient(top,rgba(0,0,0,0) 1%,rgba(0,0,0,.3) 30%,rgba(0,0,0,.6) 50%,rgba(0,0,0,.8) 70%,rgba(0,0,0,1) 100%);
background: -ms-linear-gradient(top,rgba(0,0,0,0) 1%,rgba(0,0,0,.3) 30%,rgba(0,0,0,.6) 50%,rgba(0,0,0,.8) 70%,rgba(0,0,0,1) 100%);
background: linear-gradient(top,rgba(0,0,0,0) 1%,rgba(0,0,0,.3) 30%,rgba(0,0,0,.6) 50%,rgba(0,0,0,.8) 70%,rgba(0,0,0,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient(enabled='true',startColorstr='#00000000',endColorstr='#ff000000');cursor: pointer;}

.comm-plist .gb-list2-item{ width:100%;}
.comm-plist .gb-list2-con{ color:#8e8e8e; width:160px; position:relative;}
.comm-plist .gb-list2-c1{ position:relative; overflow:hidden;}
.comm-plist .gb-list2-c1 .avatar, .comm-plist .gb-list2-c1 .mask{ width:160px; height:110px}
.comm-plist .gb-list2-c1 .mask{ display:block; z-index:1; filter:alpha(opacity:45); opacity:.45; *top:2px;}
.comm-plist .gb-list2-c1 .ico-video{ display:block; position:absolute; left:50%; top:36px; margin-left:-22px; z-index:10}
.comm-plist .gb-list2-c2{ padding:5px 0 15px 0; overflow:hidden; text-align:left;}
.comm-plist .gb-list2-c2 .txt{ font-size:14px; height:48px; line-height:24px; overflow:hidden;}
.comm-plist .gb-list2-c3{ position:absolute; z-index:2; top:83px; left:2px; width:150px; padding:0 5px; height:30px; overflow:hidden; white-space:nowrap; text-overflow:ellipsis;}
.comm-plist .gb-list2-c3 .txt{ height:30px; line-height:30px; color:#fff;}
.comm-plist .gb-list2-c3 .txt-c1{ float:left; vertical-align:middle}
.comm-plist .gb-list2-c3 .txt-c1 .ico-video1{ margin:6px 2px 7px 0}
.comm-plist .gb-list2-c3 .txt-c2{ float:right;}
.comm-plist .gb-list2-c3 .cover{ width:176px; height:48px; }
.comm-plist .gb-list2-c3 .mask{ width:180px; height:30px;}

.comm-plist .gb-list2-con:hover .gb-list2-con{ _vertical-align:baseline;}
.comm-plist .gb-list2-con:hover .gb-list2-c1{ border-color:#23d0ff}
.comm-plist .gb-list2-con:hover .gb-list2-c1 .mask, 
.comm-plist .gb-list2-con:hover .gb-list2-c1 .ico-video{ display:none}
.comm-plist .gb-list2-con:hover .gb-list2-c2 .txt{ color:#ce1910}

.comm-pn{ padding:40px 0 10px;}
.comm-pn-hd{ height: 60px; background: url(//ue.17173cdn.com/a/cf/zt/2015/ynhd/img/sprite.png) no-repeat 0 0; margin-bottom:30px;}
.comm-pn-hd .tit{ text-align: center; font-size: 45px; color:#fffc00;}
.comm-pn-hd .tit .ico{ margin:0 20px 3px 0;}
.comm-pn-bd{}

.comm-pn1{}
.comm-pn1-hd{ height: 54px; border-bottom:1px solid #262626; margin-bottom:20px;}
.comm-pn1-hd .tit{ float: left; font-size: 30px; color:#b60c00; font-weight: bold; line-height: 54px; margin-right:5px;}
.comm-pn1-hd .tit-sub{ float: left; font-size: 20px; color:#481511; margin-top:20px;}

.comm-pn2{}
.comm-pn2-hd{ margin-bottom:5px;}
.comm-pn2-hd .tit{ font-size: 25px; font-weight: bold; color:#fff;}
.comm-pn2-ex .comm-pn2-hd .tit{ font-size: 20px;}

.comm-pn3{}
.comm-pn3-hd{ margin-bottom:15px;}
.comm-pn3-hd .tit{ font-size: 25px; color:#ce1e1e; font-weight: bold;}



/*the layout*/ 
.wrapper{ background:url(//images.17173cdn.com/2015/cf/2015/04/24/bg.jpg) no-repeat center top;}

/*the header*/
.header{ width:1000px; height:644px; margin:0 auto; position:relative;}

.main-nav{ padding-top:549px;}
.main-nav-list{ overflow: hidden; *zoom:1;}
.main-nav-item{ float: left;}
.main-nav-con{ display: block; width: 248px; height: 90px; text-align: center; margin:5px 0 0 0; border-right:1px solid #232323; border-left:1px solid #171717;}
.main-nav-con .tit1{ display: block; font-size: 26px; color:#999; padding:17px 0 0 0;}
.main-nav-con .tit2{ display: block; font-size: 12px; color:#3a3937;}
.main-nav-con:hover{ width: 250px; border-right: none; border-left:none; border-top:5px solid #e72929; margin:0;  background: url(//ue.17173cdn.com/a/cf/zt/2015/ynhd/img/sprite.png) no-repeat -320px -80px;}
.main-nav-con:hover .tit1{ color:#fff; font-size: 34px; padding:10px;}
.main-nav-con:hover .tit2{ color:#ea736a; margin-top:-10px;}

/*the content*/
.content{ }
.area-in{ width: 1000px; margin:0 auto;}
.area-tit{ font-size: 40px; color:#ce1910; font-weight: bold; text-align: center;line-height: 136px;}

/*the area1*/
.area1{ height: 1350px; background: url(//ue.17173cdn.com/a/cf/zt/2015/ynhd/img/area1.png) no-repeat center top;}

.mod-signin{ padding:0 0 0 280px; position: relative; *zoom:1;}
.mod-signin .bt-signin{ position: absolute; left:94px; top:-10px; }

.comm-picbox{float:left;padding: 0 18px 0;*zoom:1; margin-bottom:30px;}
.comm-picbox-in{display:block;position:relative;}
.comm-picbox-in span{/* display:block; */}
.comm-picbox-in ,.comm-picbox .img img{width:160px;height:210px; cursor:pointer;}
.comm-picbox .cover{width: 100%;height: 100%;/* padding-top:9px; */overflow:hidden;position:absolute;top: 0;left: 0;z-index:1;font-family:"Microsoft YaHei";text-align:center;}
.comm-picbox .cover .cc{display: none;padding: 80px 13px 0;color:#fff;}
.comm-picbox .mask{width:1000px;height:1000px;background-color:#000;z-index:-1;position:absolute;opacity: 0.7; filter: alpha(opacity=70); -moz-opacity: 0.7; -khtml-opacity: 0.7; display:none;top: 0;left:0;}
.comm-picbox .cover .ico-arr{position:absolute;top:0;left:0;}
.comm-picbox .cover .cc .tit{font:bold 16px/1.1 "Microsoft YaHei";padding-left:5px;border-left:4px solid #fff;text-align:left;}
.comm-picbox .cover .cc .par {padding:5px 0 5px 10px;line-height:1.5em;text-align:left;}
.comm-picbox .cover .join-btn{display:inline-block;padding:3px 10px;background-color:#fbc554;color:#000;text-align:center;position: absolute;left: 50%;margin-left: -34px;bottom: 20px;}
.comm-picbox-in:hover{ _vertical-align: baseline;}
.comm-picbox-in:hover .mask{display:block;opacity: 0.6; filter:alpha(opacity=60); -moz-opacity:0.6; -khtml-opacity: 0.6; }
.comm-picbox-in:hover .cc{color:#dfa62e;display: block;}
.comm-picbox-in:hover .cc .tit{border-color:#dfa62e;}

.pn-exchange{ margin-bottom:-30px;}

.pn-lottery .comm-txt{ margin-bottom:25px;}
.mod-lottery-flash{ float: left; width: 560px; height: 281px;}
.mod-rule{ float: right; width: 376px; height: 255px; padding:12px 28px; background: url(//ue.17173cdn.com/a/cf/zt/2015/ynhd/img/mod-rule.png) no-repeat;}

/*the area2*/
.area2{ height: 660px; background: url(//ue.17173cdn.com/a/cf/zt/2015/ynhd/img/area2.jpg) no-repeat center top;}

.list-channel{ overflow: hidden; *zoom:1; margin-bottom:40px;}
.list-channel-item{ float: left; border: 1px solid #000;}
.list-channel-con{ display: block; width: 246px; height: 96px; border: 1px solid #292929; background: #212121; position: relative; text-align: center;}
.list-channel-con:hover{ background: #272727}
.list-channel-con .num{ font-size: 30px; color:#363636; font-family: 'Impact'; position: absolute; left:5px; top:-5px;}
.list-channel-con .txt, .list-channel-con strong{ font-size: 16px; font-weight: bold;}
.list-channel-con .txt{color:#666; display: block; padding-top:38px;}
.list-channel-con strong{ color:#ce1910;}
.list-channel-con .avatar{ display: block; padding-top:7px;}
.list-channel-item-ex .list-channel-con .txt{ padding-top:26px;}
.list-channel-item-ex1 .list-channel-con .txt{ padding-top:5px;}

.mod-notice{ float: left; width: 720px;}
.mod-code{ float: right; width: 210px; padding-right:60px; padding-top:20px; text-align: center;}
.mod-code-c2{ font-size: 14px; color:#fff; line-height: 42px;}

/*the area3*/
.area3{ background: url(//ue.17173cdn.com/a/cf/zt/2015/ynhd/img/area3.png) repeat;}

.pn-match-intro{ border-bottom:4px solid #232323; margin-bottom:25px; padding-bottom:25px;}
.pn-match-intro .comm-txt{}

.pn-match-video{ padding-bottom:25px;}

.mod-match-video{ float: left; width: 580px; padding:5px 0 0 0;}
.mod-match-video .gb-list2-item{ float: left; width: 160px; margin-right:30px;}

.mod-strategy-intro{ overflow: hidden; *zoom:1;}
.mod-strategy-intro .comm-pn2-bd p{ font-size: 14px; color:#b5b5b5; line-height: 24px;}

/*the area4*/
.area4{ background: #1e1e1e; padding-bottom:60px;}
.area4 .comm-pn2-hd{ margin-bottom:15px;}

.pn-act-recomm{ width: 785px; float: left;}

.focus-w,.focus-in{ overflow:hidden; zoom:1; height:270px; position: relative;}
.focus-con{position: relative;}
.focus-con,.focus-item,.focus-item .img{ width: 100%; height:270px;}
.focus-item img{ width:100%; height:100%}
.focus-item .txt{position: absolute;z-index:3;top: 0;left: 0; overflow:hidden;width: 172px;height: 220px;padding:  30px 100px 20px 15px;}
 
.focus-item .txt .mask2{position: absolute;z-index: -1;width:100%;height:100%;bottom: 0;left: 0;background: -webkit-linear-gradient(right,rgba(0,0,0,0) 5%,rgba(0,0,0,.3) 10%,rgba(0,0,0,.6) 40%,rgba(0,0,0,.8) 50%,rgba(0,0,0,1) 100%);
background: -moz-linear-gradient(right,rgba(0,0,0,0) 20%,rgba(0,0,0,.3) 30%,rgba(0,0,0,.6) 50%,rgba(0,0,0,.8) 70%,rgba(0,0,0,1) 100%);
background: -ms-linear-gradient(right,rgba(0,0,0,0) 20%,rgba(0,0,0,.3) 30%,rgba(0,0,0,.6) 50%,rgba(0,0,0,.8) 70%,rgba(0,0,0,1) 100%);
background: linear-gradient(right,rgba(0,0,0,0) 20%,rgba(0,0,0,.3) 30%,rgba(0,0,0,.6) 50%,rgba(0,0,0,.8) 70%,rgba(0,0,0,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient(enabled='true',startColorstr='#00000000',endColorstr='#ff000000');
cursor: pointer;
}

.focus-item  .mask{position: absolute; z-index:-1; top:0; left:0; width:400px; height:400px; width:100%\0; height:100%\0; filter:alpha(opacity:85); opacity:.85}
.focus-item .txt .tit{ font:bold 18px/30px "Microsoft Yahei"; color: #fdcd00; }
.focus-item .txt .info{color: #999; line-height: 20px;margin-top: 10px;}
.focus-item .txt .btn-join{position:absolute;left:30px;bottom:50px;width: 93px;height: 30px;text-align: center;color: #333;font:normal 16px/30px "Microsoft Yahei";background-color: #f39800; }
.focus-item .txt .btn-join:hover{background-color: #fbc554;}
.focus-item .s-tit span{ display: block;}
.focus-item .s-tit-c1{ color: #fff; font:normal 26px/1 "Times New Roman", Times, serif; }
.focus-item .s-tit-c2{ color: #555558; font: normal 12px/1.2 "Microsoft Yahei"; }

.focus-item a:hover .tit{ text-decoration:underline}
.focus-item .bg{ display:block; position:absolute; z-index:-1; top:0; left:0; width:1000px; height:1000px; background:#1f0806; filter:alpha(opacity:70); opacity:.7}
.focus-num{ overflow:hidden;  height: 4px; position: absolute; bottom: 1px; left: 5px; z-index: 5;}
.focus-num a{ display:inline-block; float:left; width: 32px; height: 4px;  background-color: #3d3d3d; margin-right: 5px;}
.focus-num a:hover{ text-decoration:none}
.focus-num .current{ background-color: #fbc554;width:40px;}
.focus-con .bt{ position: absolute;top:35%; left: 0; width: 55px; height: 80px; font: normal 60px/80px "SimSun"; text-align: center; color: #fff;  cursor: pointer; background: #000;opacity: 0.5; filter:alpha(opacity:50);}
.focus-con .forward{ left: auto; right: 0;background-position:  0 -128px;}
.focus-con .bt:hover{ background-color: #43cef2}

.pn-partner{ width: 158px; float: right; padding:0 35px 0 0;}

.logo-list{ overflow: hidden;*zoom:1; }
.logo-list li{width: 100%;padding-bottom:8px;}
.logo-list li a{display: block;width:150px;height: 50px;border: 1px solid #ddd; }
.logo-list li a img{ display: block;}

.pn-tips{ clear: both; padding-top:40px;}

/*the float*/
.list-subnav{}
.list-subnav-item{ margin-bottom:20px;}
.list-subnav-c, .bt-to-top{ display: block; width: 80px; height: 80px; background: url(//ue.17173cdn.com/a/cf/zt/2015/ynhd/img/sprite.png) no-repeat 0 -340px; text-align: center; color:#b10c00; line-height: 1.33}
.current .list-subnav-c, .list-subnav-c:hover, .bt-to-top:hover{ background-position: -100px -340px; color:#fff;}
.list-subnav-c .num{ font-family: 'Impact'; font-size: 32px; display: block; padding:6px 0 0 0;}
.list-subnav-c .tit, .bt-to-top .tit{ font-size: 18px; font-weight: bold; display: block; margin-top:-9px;}
.bt-to-top .tit{ margin:0; padding:15px 0 0 0;}

.oact .hd-w{padding: 0 15px;}
.oact{padding-top: 10px;}
.oact .bd{padding-top: 12px;}
.oact .list-item{float:left;width:19.59%;}
.oact .art-item{max-width: 160px;padding: 0 20px;}
.oact .avatar{position: relative;overflow: hidden;*zoom:1;}
.oact .art-item .txt{font-size:14px;font-weight:bold; color:#b5b5b5;margin-top:5px;}
.oact .art-item .txt1{position: absolute; right: 0; bottom: 0;z-index: 3;color:#fff;font-size: 12px;font-weight: normal;padding: 0 10px;}
.hd{ height:50px; line-height: 50px;}
.hd .tit{color: #bd5400; font: normal 20px/50px "Microsoft Yahei";}
.wpdh .hd-w,.oact .hd-w{padding: 0 15px;}
.oact .hd{border-bottom: 1px solid #c0c0c1;}
.oact .hd .tit{position: relative;margin-bottom: -1px; border-bottom:2px solid #bd5400;}
.comm-plist .art-item { margin-left: auto; margin-right: auto;}
.comm-plist1 .art-item { margin-left: auto; margin-right: auto;}
.comm-plist1 .tit { width: 99.5%; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; margin-left: auto; margin-right: auto; text-align: center;}
.pn-hd, .hd, .row, .comm-plist, .comm-plist1, .nav-list, .fs-list-txt1 { *zoom: 1;}
.pn-hd:before, .hd:before, .row:before, .comm-plist:before, .comm-vlist:before, .nav-list:before, .fs-list-txt1:before { content: ' '; display: table;}
.pn-hd:after, .hd:after, .row:after, .comm-plist:after, .comm-vlist:after, .nav-list:after, .fs-list-txt1:after { content: ' '; display: table; clear: both;}
.comm-list .list-item, .rank .list-item, .comm-list1 .list-item, .fs-list-zt .list-item,.panel21-list-pic .list-item { *overflow: hidden; *float: left; *width: 100%;}
.art-item .avatar { display: block;}
.art-item .avatar img { display: block; width: 100%;}
.pn-hd .more, .hd .more { float: right;  text-align: right;}
.mask { overflow: hidden; position: absolute; z-index: -1; top: 0; left: 0; width: 100%; height: 100%; *height: 200px; background: #000; filter: alpha(opacity=50); opacity: .5;}
:root .mask { filter: none \0;}