﻿@charset "utf-8";

html{overflow-y:scroll;}
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,button,textarea,p,blockquote,th{margin:0;padding:0;}
fieldset,img {border:0;}
ul,li,ol {list-style:none;}
select,input{vertical-align:middle;}
a{color:#333333; text-decoration:none; outline:none;star:expression(this.onFocus=this.blur());}
a:hover{ text-decoration: underline;}
.fl { float:left;}
.fr { float:right;}
.none {display:none;}
body, html {width:100%; font-family: "Microsoft YaHei","Helvetica Neue",Arial, HelveticaNeue, Helvetica, "BBAlpha Sans", sans-serif;font-weight: normal;display: -webkit-box;-webkit-box-orient: vertical; -webkit-box-align: center;}

/* *{-webkit-backface-visibility: hidden;-moz-backface-visibility: hidden;-ms-backface-visibility: hidden;backface-visibility: hidden;} 用于解决某些情况下出现闪屏的问题，若无则不加*/
body{opacity: 1;-webkit-transition:opacity 500ms ease-in;transition:opacity 500ms ease-in; }
html{ font-size: 625%; } 
@media screen and (max-width:359px) and (orientation:portrait) {
    html { font-size: 266.67%; } 
}
@media screen and (min-width:360px) and (max-width:374px) and (orientation:portrait) {
    html { font-size: 300%; } 
}
@media screen and (min-width:375px) and (max-width:399px) and (orientation:portrait) {
    html { font-size: 312.5%; } 
}
@media screen and (min-width:400px) and (max-width:413px) and (orientation:portrait) {
    html { font-size: 333.33%; } 
}
@media screen and (min-width:414px) and (max-width:431px) and (orientation:portrait){
    html { font-size: 345%; }
}
@media screen and (min-width:432px) and (max-width:479px) and (orientation:portrait){
    html { font-size:360%; }
}
@media screen and (min-width:480px)and (max-width:639px) and (orientation:portrait){
    html { font-size:400%;}
} 
@media screen and (min-width:640px)and (max-width:719px) and (orientation:portrait){
    html { font-size:533.33%;}
} 
@media screen and (min-width:720px)and (max-width:749px) and (orientation:portrait){
    html { font-size:600%;}
} 
@media screen and (min-width:720px)and (max-width:1024px) and (orientation:portrait){
    html { font-size:625%;}
} 
@media screen and (min-width:1025px) and (orientation:portrait){
    html { font-size:625%;}
}
/* 按750尺寸界面效果 1rem=100px */
body { font-size:13px; background:#ffffff; color:#333333;}

/* style */
.servername_top {width:100%; height:6.8rem; display:block; background:url(../images/servername_bg01.jpg) no-repeat center top; background-size:100%; background-size:cover; position:relative;}
.servername_cen {width:100%; height:9.6rem; display:block; background:url(../images/servername_bg02.jpg) no-repeat center top; background-size:100%; background-size:cover; position:relative;}
.servername_bot {width:100%; height:1.2rem; display:block; background:url(../images/servername_bg03.jpg) no-repeat center top; background-size:100%; background-size:cover; position:relative; color:#333333;}

.servername_logo {width:3rem; height:2rem; display:block; text-indent:-999rem; overflow:hidden; background:url(http://zy.gamexdd.com/public/images/indexpc_logo.png) no-repeat; background-size:100%; position:absolute; left:50%; top:-0.3rem; margin-left:-6.4rem; z-index:9;}
.servername_gg1 {width:6.8rem; height:2rem; display:block; background:url(../images/servername_bg01_gg.jpg) no-repeat; background-size:100%; mix-blend-mode: screen; position:absolute; left:50%; top:3rem; margin-left:-8.6rem; -webkit-animation: servername_gg1 5s linear infinite; opacity:0;transform: rotateY(180deg);}
@-webkit-keyframes servername_gg1{
  0% { opacity:0; margin-left:-2.5rem;}
  5% { opacity:1; margin-left:-8.6rem;}
  85% { opacity:1; margin-left:-5.6rem;}
  90% { opacity:0; margin-left:-11.5rem;}
  100% { opacity:0; margin-left:-2.5rem;}
}
.servername_gg2 {width:6.8rem; height:2rem; display:block; background:url(../images/servername_bg01_gg.jpg) no-repeat; background-size:100%; mix-blend-mode: screen; position:absolute; left:50%; top:4.55rem; margin-left:-4.5rem; -webkit-animation: servername_gg2 5s linear infinite; opacity:0;}
@-webkit-keyframes servername_gg2{
  0% { opacity:0; margin-left:-10.5rem;}
  5% { opacity:1; margin-left:-4.2rem;}
  85% { opacity:1; margin-left:-7.2rem;}
  90% { opacity:0; margin-left:-1.5rem;}
  100% { opacity:0; margin-left:-10.5rem;}
}

.servername_btn {width:3.6rem; height:1.2rem; display:block;text-indent:-999rem; overflow:hidden; background:url(../images/servername_btn.png) no-repeat; background-size:100%; position:absolute; left:50%; top:4rem; margin-left:-4.5rem;}
.servername_btn:hover {-webkit-filter:brightness(1.2);filter:brightness(1.2);}


/* 右浮導航 */
.point_right { position:absolute; position:fixed; right:0.05rem; top:50%; z-index:9; margin-top:-2rem; width:1.2rem;}

.point_right a {width:1.2rem; height:0.32rem; margin:0 0 0.1rem 0; text-indent:-999rem; overflow:hidden; float:left; position:relative;}
.point_right a.m1 { display:none;}
.point_right a.m5 {display:none;}
.point_right a:before {content: ''; width:1.2rem; height:100%; text-indent:-999rem; display:block; overflow:hidden; position:absolute; left:50%; top:0; margin-left:-0.6rem; z-index:2;}
.point_right a.m1:before {background:url(../images/point_right_menu1.png) no-repeat;}
.point_right a.m2:before {background:url(../images/point_right_menu2.png) no-repeat;}
.point_right a.m3:before {background:url(../images/point_right_menu3.png) no-repeat;}
.point_right a.m4:before {background:url(../images/point_right_menu4.png) no-repeat;}
.point_right a.m5:before {background:url(../images/point_right_menu5.png) no-repeat;}
.point_right a.m6:before {background:url(../images/point_right_menu6.png) no-repeat;}
.point_right a.m7:before {background:url(../images/point_right_menu7.png) no-repeat;}
.point_right a.m8:before {background:url(../images/point_right_menu8.png) no-repeat;}
.point_right a.m9:before {background:url(../images/point_right_menu9.png) no-repeat;}
.point_right a:hover {-webkit-filter:brightness(1.1);filter:brightness(1.1);}



@media screen and (max-width:1024px) and (orientation:portrait) {
.servername_top {width:100%; height:6rem; display:block; background:url(../images/servername_m_bg01.jpg) no-repeat center top; background-size:100%; background-size:cover; position:relative;}
.servername_cen {width:100%; height:10.6rem; display:block; background:url(../images/servername_m_bg02.jpg) no-repeat center top; background-size:100%; background-size:cover; position:relative;}
.servername_bot {width:100%; height:2.4rem; display:block; background:url(../images/servername_m_bg03.jpg) no-repeat center top; background-size:100%; background-size:cover; position:relative; color:#333333;}

.servername_logo { position:absolute; left:50%; top:-0.2rem; margin-left:-3.65rem;}

.servername_gg1 {width:5.6rem; height:1.65rem; display:block; background:url(../images/servername_bg01_gg.jpg) no-repeat; background-size:100%; mix-blend-mode: screen; position:absolute; left:50%; top:2.8rem; margin-left:-8.6rem; -webkit-animation: servername_gg1 5s linear infinite; opacity:0;transform: rotateY(180deg);}
@-webkit-keyframes servername_gg1{
  0% { opacity:0; margin-left:-1.5rem;}
  5% { opacity:1; margin-left:-5.6rem;}
  85% { opacity:1; margin-left:-3.2rem;}
  90% { opacity:0; margin-left:-8.5rem;}
  100% { opacity:0; margin-left:-1.5rem;}
}
.servername_gg2 {width:5.6rem; height:1.65rem; display:block; background:url(../images/servername_bg01_gg.jpg) no-repeat; background-size:100%; mix-blend-mode: screen; position:absolute; left:50%; top:3.9rem; margin-left:-4.5rem; -webkit-animation: servername_gg2 5s linear infinite; opacity:0;}
@-webkit-keyframes servername_gg2{
  0% { opacity:0; margin-left:-7.5rem;}
  5% { opacity:1; margin-left:-2.2rem;}
  85% { opacity:1; margin-left:-4.2rem;}
  90% { opacity:0; margin-left:-0.5rem;}
  100% { opacity:0; margin-left:-7.5rem;}
}

.servername_btn {position:absolute; left:50%; top:4.7rem; margin-left:-1.8rem;}



/* 底部導航 */
.point_right { position:absolute; position:fixed; left:0; right:auto; top:auto; bottom:0; z-index:9; margin-top:0px; width:100%;}
.point_right a {width:25%; height:0.8rem; margin:0; text-indent:-999rem; float:left; overflow:hidden; background:url(../images/pointm_bottom_menubg.png) no-repeat right -0.8rem; background-size:auto 200%; position:relative;}
.point_right a.m1 {display:none;}
.point_right a.m3 {display:none;}
.point_right a.m4 {display:none;}
.point_right a.m5 {display:none;}
.point_right a.m6 {display:none;}
.point_right a:after {content: ''; width:100%; height:0.8rem; text-indent:-999rem; display:block; overflow:hidden; background:url(../images/pointm_bottom_menubg.png) no-repeat left -0rem; background-size:auto 200%; position:absolute; left:0; top:0; z-index:1;}
.point_right a:before {content: ''; width:1.6rem; height:100%; text-indent:-999rem; display:block; overflow:hidden; position:absolute; left:50%; top:0; margin-left:-0.8rem; z-index:2;}
.point_right a.m1:before {background:url(../images/pointm_bottom_menu1.png) no-repeat; background-size:100%;}
.point_right a.m2:before {background:url(../images/pointm_bottom_menu2.png) no-repeat; background-size:100%;}
.point_right a.m3:before {background:url(../images/pointm_bottom_menu3.png) no-repeat; background-size:100%;}
.point_right a.m4:before {background:url(../images/pointm_bottom_menu4.png) no-repeat; background-size:100%;}
.point_right a.m5:before {background:url(../images/pointm_bottom_menu5.png) no-repeat; background-size:100%;}
.point_right a.m6:before {background:url(../images/pointm_bottom_menu6.png) no-repeat; background-size:100%;}
.point_right a.m7:before {background:url(../images/pointm_bottom_menu7.png) no-repeat; background-size:100%;}
.point_right a.m8:before {background:url(../images/pointm_bottom_menu8.png) no-repeat; background-size:100%;}
.point_right a.m9:before {background:url(../images/pointm_bottom_menu9.png) no-repeat; background-size:100%;}
.point_right a:hover {-webkit-filter:brightness(1.1);filter:brightness(1.1);}
}