@charset "UTF-8";
/*!
 * demo-hotgame
 * Author:
 * Update by 2020-09-01
 */

/*========== hotgame =================*/
.hotGame{width: 100%;min-height: 920px;background: url(/ftl/commonPage/images/hotgame/hotgame-bg.png) no-repeat center top;background-attachment: fixed;padding: 60px 0 26px;}
.hotGame .hot-match{width: 1200px;height: 220px;position: relative;margin-bottom: 54px;}
.hotGame .hot-match .match-list{height: 220px;padding: 0;overflow: hidden;}
.hotGame .hot-match .match-list li{width:400px;color: #fff;list-style: none;font-size: 14px;font-weight: 400;}
.hotGame .hot-match .match-list li .cloak-box{width:380px;height: 220px;position:relative;margin: 0 auto;padding: 19px;background:url(/ftl/commonPage/images/hotgame/match_bg.png);}
.hotGame .hot-match .match-list li .cloak-box .info{display: flex;flex-direction:column;}
.hotGame .hot-match .match-list li .cloak-box .text-center{width: 198px;margin: 0 auto;}
.hotGame .hot-match .match-list li .cloak-box .text-center .top-title{height: 30px;font-size: 16px;line-height: 2;}
.hotGame .hot-match .match-list li .cloak-box .text-center .time{margin:0;}
.hotGame .hot-match .match-list li .cloak-box .text-center .vs_text{width: 52px;height: 28px;margin: 28px auto;background:url(/ftl/commonPage/images/hotgame/vs-text.png);}
.hotGame .hot-match .match-list li .cloak-box .text-center .team-btn{width: 102px;height: 28px;margin:0 auto;background:url(/ftl/commonPage/images/hotgame/team-btn.png);}
.hotGame .hot-match .match-list li .cloak-box .text-center .team-btn em{display: block;text-align: center;font-style: normal;line-height: 28px;font-size: 13px;background-image: linear-gradient(45deg, #eedf7a,#fff5b4, #eedf7a);-webkit-background-clip: text;color: transparent;filter: drop-shadow(0px 2px 1px black);}
.hotGame .hot-match .match-list li .cloak-box .text-left,.hotGame .hot-match .match-list li .cloak-box .text-right{position:absolute;top:19px;padding-top:62px;}
.hotGame .hot-match .match-list li .cloak-box .text-right{right: 19px;}
.hotGame .hot-match .match-list li .cloak-box .text-left{left: 19px;}
.hotGame .hot-match .match-list li .cloak-box .icon{margin-bottom: 26px;text-align: center;}
.hotGame .hot-match .match-list li .cloak-box .team-name{width: 90px;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;text-align: center;}
.hotGame .hot-match .match-list li .cloak-box .logo-img img{width:55px;height: 55px;}
.hotGame .hot-match .gui{width: 30px;height: 30px;position: absolute;top: 95px;border-radius: 50%;text-align: center;padding-top: 9px;background: #373737;cursor: pointer;}
.hotGame .hot-match .gui.gui-chevron-right{right: -47px;}
.hotGame .hot-match .gui.gui-chevron-left{left: -47px;}
.hotGame .hot-match .gui:before{color: #767777;}
.hotGame .hot-match .gui:hover{background: #999269;}
.hotGame .hot-match .gui:hover:before{color: #FCFDFD;}
/*游戏*/
.hotGame .hotGame_in{width: 180px;height: 210px;float:left;display:inline-block;position: relative;margin:10px 30px}
.hotGame .hotGame_in .game_name{width: 100%;position: absolute;bottom: 10px;text-align: center;font-size: 14px;color: white;z-index: 10;transition: all 300ms;}
.hotGame .hotGame_in .game_bg{width: 156px;height: auto;position: absolute;left: 50%;top: 90px;transform: translate(-50%,-50%);}
.hotGame .hotGame_in .game_logo{width: auto;position: absolute;left: 20px;top: 30px;transform: translateY(-50%);z-index: 10;}
.hotGame .hotGame_in .hotGame_btn{width: 180px;height: 210px;border-radius: 4px;background: rgba(97, 97, 65,0.769) url(/ftl/commonPage/images/hotgame/team-btn.png) no-repeat center;position: absolute;left: 50%;top: 0;transform: translateX(-50%);z-index: 9;opacity: 0;transition: all 500ms;}
.hotGame .hotGame_in .hotGame_btn em{width: 100%;position: absolute;top: 50%;transform: translateY(-52%);text-align: center;font-style: normal;font-size: 13px;background-image: linear-gradient(45deg, #eedf7a,#fff5b4, #eedf7a);-webkit-background-clip: text;color: transparent;filter: drop-shadow(0px 2px 1px black);}
.hotGame .hotGame_in:hover .game_name{color: rgb(255, 255, 169);}
.hotGame .hotGame_in:hover .hotGame_btn{opacity: 1;}