@charset "utf-8";
* { margin: 0; padding: 0; list-style: none; word-break: break-all; -webkit-appearance: none; box-sizing: border-box;}
html { background: #fff;}
body { min-height: 100vh; color: #000; font-size: 14px; min-height: 100vh; background: url(bg01.jpg) top center no-repeat #fff; background-size: cover;font-family: PingFang SC, Lantinghei SC, Helvetica Neue, Helvetica, Arial, Microsoft YaHei, \\5FAE\8F6F\96C5\9ED1, STHeitiSC-Light, simsun, \\5B8B\4F53, WenQuanYi Zen Hei, WenQuanYi Micro Hei, "sans-serif";}
a { color: inherit; display: inline-block; text-decoration: none;}
img { max-width: 100%; border: 0; vertical-align: middle;}

/*pc*/
.pc_wrapper { width: 1200px; margin: 0 auto; padding-top: 60px;}
.top{ display: flex;}
.sliderBox{ flex: 1; margin-top: 50px; position: relative;}
.sliderBox img {float: right;}
.txtBox {width: 500px;margin-left: 40px;}
.txtBox .logo{ margin-bottom: 30px;width: 100%;text-align: center;}
.txtBox .tools{float: left;width: 100%;margin-bottom: 15px;height: 70px;}
.txtBox .tools a{float: left;width: 31%;transition:0.5s;margin: 0 3.5% 0 0;}
.txtBox .tools a:hover{margin-top: -5px;}
.txtBox .tools a:nth-child(3){margin-right: 0;}
.txtBox .tools a img{float: left;width: 100%;}
.txtBox ul{ font-size: 24px; text-align: center;float: left;width: 100%;}
.txtBox ul li{float: left;margin: 0 0 10px 0;width: 100%;height:82px;}
.txtBox ul li a{display: block; width: 100%; height: 82px; line-height: 82px; float: left;padding-left: 40px;
background: 
linear-gradient(135deg, transparent 8px, rgb(255,255,255,1) 0) top left,
linear-gradient(-135deg, transparent 8px, rgb(255,255,255,1) 0) top right,
linear-gradient(-45deg, transparent 8px, rgb(255,255,255,1) 0) bottom right,
linear-gradient(45deg, transparent 8px, rgb(255,255,255,1) 0) bottom left;
background-size: 250px 40px;
background-repeat: no-repeat; 
height: 80px;   
width: 500px;
}
.txtBox ul li a:hover{
background: 
linear-gradient(135deg, transparent 8px, rgb(38,159,254,1) 0) top left,
linear-gradient(-135deg, transparent 8px, rgb(38,159,254,1) 0) top right,
linear-gradient(-45deg, transparent 8px, rgb(38,159,254,1) 0) bottom right,
linear-gradient(45deg, transparent 8px, rgb(38,159,254,1) 0) bottom left;
background-size: 250px 40px;
background-repeat: no-repeat; 
height: 80px;   
width: 500px;
}
.txtBox ul li a:hover b{color: #fff;}
.txtBox ul li a:hover i{color: #fff;border: 1px solid #fff;}
.txtBox ul li a:hover .img img:first-child{top: -40px;}
.txtBox ul li a:hover .img img:last-child{top: 0;}
.txtBox ul li a .img{float: left;width: 40px;margin: 20px 25px 0 0;position: relative;height: 40px;transition:0.5s;overflow: hidden;}
.txtBox ul li a .img img{float: left;height: 40px;position: absolute;z-index: 3;left: 0;top: 0;transition:0.5s;}
.txtBox ul li a .img img:last-child{position: absolute;z-index: 3;left: 0;top: 40px;transition:0.5s;height: 40px;width: 40px;}
.txtBox ul li a b{float: left;height: 80px;font-size: 24px;color: #000;font-weight: normal;transition:0.5s;}
.txtBox ul li a i{float: right;height:40px;margin: 20px 30px 0 0;background: #269ffe;color: #fff;padding: 0 30px;border-radius: 52px;line-height: 38px;font-style: normal;font-size: 16px;border:1px solid #269ffe;transition:0.5s;}
/*game*/
.game { display: flex; justify-content: space-between; text-align: center; font-size: 18px;}
.game .item {}
.game .item .img { margin-bottom: 12px; box-shadow: 0 5px 10px rgba(0,0,0,.02); border-radius: 4px; background: #fff; position: relative;}
.game .item .img span {}
.game .item .img div { display: none; position: absolute; top: 0; left: 0; width: 260px; height: 160px; padding-top: 98px; color: #fff; border-radius: 4px; background: url(../pc_files/img11.png) center 46px no-repeat rgba(0,0,0,.7);}
.game .item .txt {}
.game .item a:hover .img div { display: block;}
.footer { padding: 40px 0; text-align: center; color: #959595;}