*{margin: 0; padding: 0; list-style: none; border: 0}
html,body{ width: 100%; font-family: Microsoft YaHei; background-color: #000}
a{text-decoration: none}

.head{ width: 100%; position: relative; }
.head p{ width: 100%; display: block; background-position: top center }
.head .b1{ background-image: url(img/pc_01.jpg);  height: 640px; }
.head .b2{ background-image: url(img/pc_02.jpg);  height: 760px; }
.head .logo_wysd{ position: absolute; top: 50px; left: 50%; margin-left: -135px; }
.head .rule{ position: absolute; top: 1150px; left: 50%; margin-left: -520px; font-size: 14px; color: #bfa167; line-height: 26px; }
.head .rule h1{ font-size: 18px; padding-bottom: 10px;}
.head .rule a{ color: #bfa167; text-decoration: underline; }
.head .rule a:hover{ color: #fff }
.head .rule span{ color: #cb4a4d }
.wrap{ width: 100%; background: url(img/pc_03.jpg) top center no-repeat; height: 1637px; }
.inner{ width: 1200px; margin: 0 auto; }
.game_box{ width: 470px; padding-left: 440px; height: 370px; position: relative;}
.game_1{ padding-top: 50px; }
.game_1.game_box{ width: 850px; padding-left: 280px;  text-indent: 2em; }
.game_1 .qrcode_1{ position: absolute; top: 60px; left: 50px }
.game_2 .qrcode_1{ position: absolute; top: 20px; left: 220px }
.game_2 .qrcode_2{ position: absolute; top: 20px; left: 960px }
.game_3 .qrcode{ position: absolute; top: 0px; left: 50px }
.game_4 .qrcode{ position: absolute; top: 0px; left: 940px }
.game_box.game_2{ padding-left: 440px; padding-top: 30px; }
.game_box.game_2 .intro{width: 480px; text-indent: 2em;}
.game_box.game_3{ padding-left: 280px;}
.game_box.game_3 .intro{ width: 590px; text-indent: 2em; }
.game_box.game_4{ padding-left: 380px;}
.game_box.game_4 .intro{ width: 520px; text-indent: 2em; }
.game_2 .logo{ margin: 5px 0 0 20px; }
.game_3 .logo{ margin: 5px 0 0 20px; }
.icon_box{ width: 100%; height: 60px; }
.icon_box a{ display: block; float: left; }
.icon_box img{ display: block; margin: 0 auto;}
.icon_box .video{ display: block; margin: -10px 0 0 50px}
.intro{ width: 850px; float: left;}
.intro .name{ font-size: 30px; font-weight: bold; color: #ffe7ba }
.intro p{ font-size: 14px; color: #bfa167; line-height: 28px; padding-top: 10px; }


.app{ padding-left: 80px; width: 1100px; padding-top: 20px;}
.app .intro{ width: 660px; }


.pop_video{ width:800px; height:450px; position:fixed; top:200px; left:50%; margin-left:-400px; z-index:11; padding:5px; background:#000; display:none;}
.pop_video .close{ width:39px; height:39px; position:absolute;	top:0px; right:-39px; background-color: #000; display:block;}
.pop_video .close img{ padding:6px; transition:all ease 0.5s;}
.pop_video .close:hover img{ transform:rotate(360deg);}

.mask{ width:100%; height:100%; _height:5000px; position:fixed; _position:absolute; background:rgba(0,0,0,.8); filter:alpha(opacity=80)\9; background:#000\9; z-index:8; top:0; left:0; display:none;}

.footer{ width: 100%; text-align: center; background: #000; padding: 60px 0; }
.footer .foot_nav{ color: #999; font-size: 14px; }
.footer .foot_nav a{ color: #999; padding: 0 25px; }
.footer .foot_nav a:hover{ color: #fff }
.footer .copyright{ font-size: 14px; color: #999; line-height: 25px; padding-top: 10px; }
.footer .copyright a{ color: #999; padding: 0 10px; }
.footer .copyright a img{ height: 17px; vertical-align: middle; margin-top: -3px; margin-right: 5px; }
.footer .copyright a:hover{ color: #ff7444 }