/* 顶部 */ body { background: url(../img/c_top_b.png) repeat-x, url(../img/content01.jpg) no-repeat #daa91c; } .c_top { background: url(../img/c_top_l.png) no-repeat left, url(../img/c_top_r.png) no-repeat right, url(../img/c_top_bg.png) repeat-x; height: 92px; width: 90%; margin: 0 auto; text-align: center; } .c_top > span { display: inline-block; height: 92px; line-height: 92px; color: #fff; } .c_top .c_name { margin-left: 144px; font-size: 24px; text-align: left; float: left; width: 15%; background-image: -webkit-linear-gradient(bottom,#613c0f,#ffaf5b,#ffffff); -webkit-background-clip: text; -webkit-text-fill-color: transparent; } .c_top .c_name img{ height: 62px; margin: 12px 15px 18px 0; display: block; float: left; } .c_top .c_tit { margin-left: calc(-15% + -144px); font-size: 26px; } .c_top .c_set{ position: absolute; right: 1%; color: #000; font-size: 20px; width: 6%; text-align: center; cursor: pointer; display: inline-block; height: 92px; line-height: 92px; } .c_top .c_set:hover .c_sets{ display: block; } .c_top .c_inf{ font-size: 20px; position: absolute; right: 15%; background-image: -webkit-linear-gradient(bottom,#613c0f,#ffaf5b,#ffffff); -webkit-background-clip: text; -webkit-text-fill-color: transparent; } .c_top .c_inf div{ float: left; } /* 设置 */ .c_sets { position: absolute; right: -9%; background: #666; top: 82px; width: 140%; text-align: center; border-radius: 3px; z-index: 99999; display: none; } .c_set_t{ display: inline-block; width: 21px; height: 21px; background: url(../img/c_pot.png) no-repeat; vertical-align: text-top; -webkit-background-size: cover; background-size: cover; } .c_sets ul{ /* padding: 5px 0; */ } .c_sets li{ line-height: normal; } .c_sets li:hover{ background: #999; border-radius: 3px; } .c_sets .c_horn{ height: 15px; width: 15px; transform: rotate(45deg); position: absolute; top: -6px; right: 33%; background: #666; border-radius: 3px; z-index: -1; } .c_sets .c_horn:hover { background: #666; } .c_sets .item{ display: inline-block; width: 100%; padding: 10px 0; font-size: 16px; cursor: pointer; } .c_sets .item label{ color: #fff; cursor: pointer; } /* 图标 */ .c_sets span { display: inline-block; width: 18px; height: 18px; background: url(../img/goback_white.png) center center no-repeat; vertical-align: text-bottom; -webkit-background-size: cover; background-size: cover; margin-left: 5px; cursor: pointer; } /* 列表 */ .play .game-tab { width: 80%; visibility: visible; -moz-transform: translate(-50%, -48%); -ms-transform: translate(-50%, -48%); -webkit-transform: translate(-50%, -48%); transform: translate(-50%, -48%); } .head { width: 100%; height: 75px; background: rgba(0,0,0,0.5); position: fixed; left: 0; top: 92px; z-index: 999; } .play .box .table-hd { background: #dac08e; } .play .box .table-hd .title { font-size: 18px; font-weight: 600; padding: 5px 10px; color: #000; display: inline-block; } .play .box .table-hd .title { font-size: 18px; font-weight: 600; padding: 5px 10px; color: #000; display: inline-block; } .play .box .table-hd .title .white { color: #683c20; padding-left: 5px; } .play .info { float: right; } .play .info p { color: #000; padding-right: 30px; font-weight: 600; display: inline-block; font-size: 16px; line-height: 35px; } .play .road { position: relative; } .play canvas { display: block; background: #fff; width: 100%; } /* .play .road .mask { position: absolute; width: 100%; height: 100%; top: 0; left: 0; text-align: center; font-size: 45px; background: #4a4a4a; color: #fff; font-weight: 500; opacity: 0.5; display: none; } */ .play .road .countdown { position: absolute; font-size: 100px; font-weight: 600; color: rgba(0,0,0,0.4); left: 50%; top: 50%; -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); display: none; } .play .limit { color: #000; padding: 4px 10px; background: #dac08e; font-weight: 600; } .play .limit .limit_money { display: inline-block; font-size: 16px; overflow: hidden; vertical-align: middle; padding-right: 30px; } .play .game-tab .list-tab .info { color: #000; font-size: 18px; margin-top: 0; padding: 0 10px; background: #dac08e; font-weight: 600; } .play .game-tab .list-tab ul li { margin: 15px 0 5px; width: 50%; } .play .game-tab .list-tab .box { margin: 0 auto; overflow: hidden; } .play .game-tab .list-tab ul { margin-left: 0; } /*滚动条样式*/ .play .game-tab .dragscroll::-webkit-scrollbar { width: 2px; height: 2px; } .play .game-tab .dragscroll::-webkit-scrollbar-thumb { border-radius: 100px; -webkit-box-shadow: inset 0 0 5px rgba(0,0,0,0.2); background: rgba(255,255,255,0.8); } .play .game-tab .dragscroll::-webkit-scrollbar-track { -webkit-box-shadow: inset 0 0 5px rgba(0,0,0,0.2); border-radius: 100px; background: rgba(0,0,0,0.5); } .play .game-tab .dragscroll li .box{ position: relative; margin: 0 auto; } .play .game-tab .dragscroll li{ width: 50%; float: left; position: relative; } .play .game-tab .dragscroll li .iframe_box{ display: block; } .play .minicontrol{ display: none } /* */ .play .game-tab .tab-nav { width: 101%; background: linear-gradient(#dfc276,#f7dc95,#f2d589,#dfc276); /* position: fixed; left: 0; top: 0; z-index: 99; */ padding: 5px 0; } .play .game-tab .tab-nav .list { float: left; width: 50%; height: 35px; position: relative; padding-left: 100px; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; overflow: hidden; } .play .game-tab .tab-nav .list .lab { font-weight: 600; color: #000; font-size: 20px; display: inline-block; vertical-align: middle; padding: 0 20px; position: absolute; left: 0; top: 0; line-height: 36px; } .play .game-tab .tab-nav .list .link { display: inline-block; width: 35px; height: 35px; background: linear-gradient(#9a8959,#b19b5f,#988557,#56420c); border-radius: 100%; line-height: 35px; text-align: center; color: #fff; font-weight: 600; font-size: 18px; } .play .game-tab .tab-nav .list .link:hover { background: linear-gradient(#FFEB3B,#FFC107,#FF9800,#FFEB3B); box-shadow: 0px 0px 2px #000; -moz-box-shadow: 0px 0px 2px #000; color: #fff; -webkit-transition: all 0.2s; -moz-transition: all 0.2s; transition: all 0.2s; } @media screen and (max-width: 1480px){ .play .game-tab { max-height: 495px; } } @media (min-width: 1646px) and (max-width: 1900px) { .play .game-tab { max-height: 550px; } } .play .game-tab .tab-nav .list .link { color: #fff; }