/* reset */
body,dl,dd,ul,ol,h1,h2,h3,h4,h5,h6,p,form,header,section,article,footer{margin:0;}
body,button,input,select,textarea{font:12px/1.5 tahoma,'\5FAE\8F6F\96C5\9ED1',sans-serif}
h1,h2,h3,h4,h5,h6{font-size:100%}
em,b{font-style:normal}
a{text-decoration:none; outline: none;-webkit-tap-highlight-color: rgba(0, 0, 0, 0);} 
a:hover{text-decoration:none;}
img{border:0} 
button,input,select,textarea{font-size:100%;outline:none}
table{border-collapse:collapse;border-spacing:0}
td,th,ul,ol{padding:0;list-style: none;}
body {padding-top: 42px;padding-bottom: 1.4rem}
iframe {display: none}
* {box-sizing: border-box; outline: none;}
.hidden{display: none; font-size: 0; text-indent: -999em;}
.clearfix:after {visibility: hidden;display: block;font-size: 0;content: " ";clear: both;height: 0;}
.clearfix{*zoom:1;}
#afooter{text-align:center; line-height: 20px;color: #fff;position: relative; z-index: 2;font-size: 14px;padding: 10px 0;min-width: 1100px;background: #000;margin: 0 auto -2em;max-width: 1920px;}
#afooter a{ color: #fff;}

.wrapper {position: relative; width: 100%; min-width: 1280px;  text-align: center; overflow: hidden; font-size: 0; color: #fff;}
.bgd {position: absolute; top: 0; left: 0; width: 100%;}
.bgd__bg1 {width: 100%; height: 1571px; background: url(//game.gtimg.cn/images/fo4/cp/a20191205eacc/bg1.jpg) top center no-repeat}
.bgd__bg2 {width: 100%; height: 1201px; background: url(//game.gtimg.cn/images/fo4/cp/a20191205eacc/bg2.jpg) top center no-repeat}
.bgd__bg3 {width: 100%; height: 2688px; background: url(//game.gtimg.cn/images/fo4/cp/a20191205eacc/bg3.jpg) top center no-repeat}

.content {position: relative; width: 1280px; margin: 0 auto; z-index: 2;}

.content__header {height: 1571px; padding-top: 62px;}
.content__body {height: auto;}

.content__block1 {height: 1201px;}
.content__block2 {height: auto;}

/* Header S */
.logo {display: block; width: 84px; height: 101px; margin: 0 auto 22px auto; background: url(//game.gtimg.cn/images/fo4/cp/a20191205eacc/logo.png) no-repeat; }
.logo-fo4 {position: absolute; top: 30px; left: 150px; display: block; width: 317px; height: 62px; background: url(//game.gtimg.cn/images/fo4/cp/a20191205eacc/logo-fo4.png) no-repeat; }
.header_title {display: block; width: 1030px; height: 227px; margin: 0 auto; background: url(//game.gtimg.cn/images/fo4/cp/a20191205eacc/header-title.png) no-repeat;}
.header__subtitle {height: 32px; line-height: 32px; font-size: 16px; text-align: center; color: #d5dcff;}
.header__time {height: 32px; line-height: 32px; font-size: 24px; text-align: center; color: #d6dcff;}
.header__stage {position: relative; width: 100%; height: 120px; margin: 30px auto 0 auto; font-size: 0; text-align: center;}
.header__stage__link {vertical-align: top; display: inline-block; width: 100px; height: 60px; margin-top: 30px; background: url(//game.gtimg.cn/images/fo4/cp/a20191205eacc/stage-link.png) no-repeat;}
.header__stage__item {vertical-align: top; display: inline-block; width: 360px; height: 120px; padding-top: 24px; border: 1px solid #4663cb; border-radius: 60px; background-color: #001485;}
.header__stage__item .p1 {height: 38px; line-height: 38px; text-align: center; font-weight: bold; font-size: 32px; color: #abbdff;}
.header__stage__item .p2 {height: 32px; line-height: 32px; text-align: center; font-size: 16px; color: #ffd541;}

.header__btn {width: 720px; height: 67px; margin: 30px auto 0 auto;}
.btn-download {float: left;  width: 212px; height: 67px; line-height: 67px; text-align: center; font-size: 26px; color: #ffffff; background: url(//game.gtimg.cn/images/fo4/cp/a20191205eacc/header-btn.png) no-repeat;}
.btn-home {float: right;  width: 212px; height: 67px; line-height: 67px; text-align: center; font-size: 26px; color: #ffffff; background: url(//game.gtimg.cn/images/fo4/cp/a20191205eacc/header-btn.png) no-repeat;}
/* Live */
.header__live {position: relative; width: 864px; margin: 52px auto;}
.header__live__nav {position: relative; width: 774px; height: 78px; margin: 0 auto; overflow: hidden;}
.header__live__list {position: absolute; top: 0; left: 0; width: 9999px; height: 78px; font-size: 0; text-align: left; transition: all .3s;}
.header__live__item {position: relative; vertical-align: top; display: inline-block; width: 184px; height: 78px; margin-right: 12px; background: url(//game.gtimg.cn/images/fo4/cp/a20191205eacc/live-bg.png) no-repeat; opacity: .5; cursor: pointer;}
.header__live__item--active {opacity: 1;}
.header__live__item a {position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 9;}

.live__prev {position: absolute; top: 21px; left: 0; display: block; width: 17px; height: 33px; background: url(//game.gtimg.cn/images/fo4/cp/a20191205eacc/live-arrow.png) no-repeat; background-position: 0 0;}
.live__next {position: absolute; top: 21px; right: 0; display: block; width: 17px; height: 33px; background: url(//game.gtimg.cn/images/fo4/cp/a20191205eacc/live-arrow.png) no-repeat; background-position: -17px 0;}

.header__live__tv {width: 680px; height: 384px; margin: 56px auto 80px auto; background-color: #FFFFFF;}
.header__live__tv iframe {display: block; width: 100%; height: 100%;}
.header__live__info {width: 798px; height: 160px; font-size: 0; text-align: center;}
.header__live__info__item {vertical-align: top; display: inline-block; width: 266px; height: 160px; padding-left: 30px; background: url(//game.gtimg.cn/images/fo4/cp/a20191205eacc/info-line.png) no-repeat; text-align: left;}
.header__live__info__item .p1 {line-height: 30px; margin-bottom: 20px; font-size: 44px; color: #ffffff;}
.header__live__info__item .p2 {line-height: 20px; margin-bottom: 20px; font-size: 24px; color: #bcc4f2;}
.header__live__info__item .p3 {line-height: 24px; font-size: 17px; color: #adb1ca;}
.header__live__info__item .yellow {color: #ffe400;}


/* Block1 */
.content__block1 {position: relative; padding-top: 110px;}
.block1__title {width: 700px; height: 80px; margin: 0 auto; background: url(//game.gtimg.cn/images/fo4/cp/a20191205eacc/block-title1.png) no-repeat;}
.block1__subtitle {height: 58px; line-height: 58px; font-size: 24px; text-align: center; color: #3262fe;}
.block1__team {width: 1272px; height: 212px; margin: 42px auto 36px auto; font-size: 0; text-align: left; box-shadow: 0 0 40px rgba(0, 6, 78, .2);}
.block1__team__item {vertical-align: top; display: inline-block; width: 106px; height: 212px; text-align: center; border-right: 1px solid #dfe1e7; cursor: pointer;}
.block1__team__item:last-child {border-right: none;}
.block1__team__item .top {width: 105px; height: 106px; background-color: #ffffff;}
.block1__team__item .bottom {display: flex; align-items:center; justify-content:center; width: 105px; height: 106px; background-color: #f8f8fa;}
.block1__team__item .bottom p {line-height: 20px; font-size: 18px; color: #3a3c43;}
.block1__team__item--active .top {background-color: #003cff;}
.block1__team__item--active .bottom {background-color: #ffd541;}

.block1__player {position: relative;}
.player__state {position: absolute; top: 20px; left: 50%; transform: translateX(-50%); width: 500px; height: 68px; text-align: center; }
.player__state img {vertical-align: top; display: inline-block; width: 98px; height: 68px; margin: 0 6px; border: 1px solid #e5e5e5;}
.player__list {width: 936px; height: 600px; margin: 0 auto; text-align: center;}
.player__item {position: relative; vertical-align: top; display: inline-block; width: 300px; height: 458px; padding-top: 216px; background: url(//game.gtimg.cn/images/fo4/cp/a20191205eacc/player-bg.png) no-repeat;}
.player__item:nth-child(2) {top: 112px; margin: 0 18px;}
.player__item img {position: absolute; bottom: 270px; left: 50%; transform: translateX(-50%);}
.player__item .p1 {position: absolute; bottom: 0; height: 180px; width: 100%; line-height: 32px; text-align: center; font-size: 24px; color: #000000;}
.player__item .p2 {width: 100%; height: 28px; line-height: 28px; margin-bottom: 12px; text-align: center; font-size: 22px; color: #000000;}
.player__item .p3 {width: 100%; line-height: 20px; padding: 0 28px; text-align: left; font-size: 16px; color: #000000;}


/* Block2 */
.block2__title {width: 1280px; height: 160px; padding: 50px 0 40px 0; border-bottom: 10px solid #003cff; background: url(//game.gtimg.cn/images/fo4/cp/a20191205eacc/block-title2.png) no-repeat center 40px;}
.block2__title .btn-rule {float: right; display: block; width: 240px; height: 60px; line-height: 60px; border-radius: 30px; text-align: center; font-size: 22px; color: #003cff; background-color: #ffffff;}


.block2__squad__rule {width: 100%; height: 256px; padding-top: 50px; border-bottom: 1px solid #003cff;}
.squad__rule__title {width: 195px; height: 50px; margin: 0 auto; background: url(//game.gtimg.cn/images/fo4/cp/a20191205eacc/squad-rule.png) no-repeat;}
.squad__rule__subtitle {line-height: 24px; text-align: center; font-size: 18px; color: #000000;}

.block2__group__stage {width: 100%; height: 540px; padding-top: 50px; border-bottom: 1px solid #003cff;}
.group__stage__title {width: 219px; height: 50px; margin: 0 auto; background: url(//game.gtimg.cn/images/fo4/cp/a20191205eacc/group-stage.png) no-repeat;}
.group__stage__subtitle {line-height: 24px; text-align: center; font-size: 18px; color: #000000;}

.group__list {width: 100%; height: 320px; font-size: 0; margin-top: 32px;}
.group__item {vertical-align: top; display: inline-block; width: 312px; height: 320px; margin-right: 10px; background: url(//game.gtimg.cn/images/fo4/cp/a20191205eacc/group-bg.png) no-repeat;}
.group__item:last-child {margin-right: 0;}
.group__item__head {width: 312px; height: 80px; line-height: 80px; text-align: center; font-size: 26px; color: #ffe400;}
.group__item__item {height: 80px; line-height: 80px; border-bottom: 1px solid #d9d9d9; text-align: left;}
.group__item__item img {vertical-align: top; display: inline-block; width: 80px; height: 80px; margin-right: 32px;}
.group__item__item p {vertical-align: top; display: inline-block; height: 80px; line-height: 80px; font-size: 18px; color: #000000;}

.block2__knock-out_stage {width: 100%; height: 900px; padding-top: 50px; border-bottom: 1px solid #003cff;}
.knock-out_stage__title {width: 294px; height: 50px; margin: 0 auto; background: url(//game.gtimg.cn/images/fo4/cp/a20191205eacc/knock-out-stage.png) no-repeat;}
.knock-out_stage__subtitle {line-height: 24px; text-align: center; font-size: 18px; color: #000000;}
.knock-out-table {width: 1280px; height: 680px; margin-top: 30px; background: url(//game.gtimg.cn/images/fo4/cp/a20191205eacc/knock-out-bg.png) no-repeat;}
.knock-out-table__head {width: 100%; height: 80px; line-height: 80px; text-align: center; font-size: 40px; color: #ffe400;}
.knock-out-table__body {position: relative; width: 736px; height: 470px; margin: 54px auto; background: url(//game.gtimg.cn/images/fo4/cp/a20191205eacc/knock-out-table.png) no-repeat;}
.p-div {position: absolute; width: 326px; height: 78px; font-size: 0;}
.p-div .p-time {position: absolute; top: 50%; transform: translateY(-50%); vertical-align: top; display: inline-block; width: 146px; line-height: 16px; text-align: center; font-size: 16px; color: #000000;}
.p-div .p-name {position: absolute; top: 0; vertical-align: top; display: inline-block; width: 180px; height: 78px; line-height: 78px; text-align: center; font-weight: bold; font-size: 22px; color: #ffffff;}

.p-div:nth-child(1) {top: 0; left: 0;}
.p-div:nth-child(2) {top: 98px; right: 0;}
.p-div:nth-child(3) {top: 196px; left: 0;}
.p-div:nth-child(4) {top: 294px; right: 0;}
.p-div:nth-child(5) {top: 392px; left: 0;}

.p-div:nth-child(1) .p-time,
.p-div:nth-child(3) .p-time,
.p-div:nth-child(5) .p-time {left: 0;}
.p-div:nth-child(2) .p-time,
.p-div:nth-child(4) .p-time {right: 0;}

.p-div:nth-child(1) .p-name,
.p-div:nth-child(3) .p-name,
.p-div:nth-child(5) .p-name {right: 0;}
.p-div:nth-child(2) .p-name,
.p-div:nth-child(4) .p-name {left: 0;}

.block2__final__stage {width: 100%; height: 976px; padding-top: 50px;}
.final__stage__table {width: 1280px; height: 680px; margin: 0 auto; background: url(//game.gtimg.cn/images/fo4/cp/a20191205eacc/final-stage-bg.png) no-repeat;}
.final__stage__head {width: 100%; height: 112px; padding: 22px 0; text-align: center;}
.final__stage__head p:nth-child(1) {width: 100%; height: 40px; line-height: 40px; text-align: center; font-size: 42px; color: #ffe400;}
.final__stage__head p:nth-child(2) {width: 100%; text-align: center; font-size: 18px; color: #FFFFFF;}

.final__stage__body {position: relative; width: 1111px; height: 339px; margin: 114px auto 0 auto; background: url(//game.gtimg.cn/images/fo4/cp/a20191205eacc/final__stage-table.png) no-repeat;}
.final__stage__item {position: absolute; width: 350px; height: 70px; font-size: 0;}
.final__stage__item img {vertical-align: top; display: inline-block; width: 70px; height: 70px;}
.final__stage__item p {vertical-align: top; display: inline-block; width: 280px; height: 70px; line-height: 70px; text-align: center; font-size: 18px; color: #ffffff;}
.final__stage__item:nth-child(1) {top: 0; left: 0;}
.final__stage__item:nth-child(2) {top: 80px; left: 0;}
.final__stage__item:nth-child(3) {top: 180px; left: 0;}
.final__stage__item:nth-child(4) {top: 260px; left: 0;}
.final__stage__item:nth-child(5) {top: 37px; left: 435px;}
.final__stage__item:nth-child(6) {top: 222px; left: 435px;}

.final__stage__body .champion {position: absolute; top: 0; right: 0; width: 240px; height: 339px; padding-top: 150px;}
.final__stage__body .champion p {height: 24px; line-height: 24px; text-align: center; font-size: 20px; color: #ffffff;}


