/*login*/

html.login-tea{background:url(../img/bg.desktop.jpg) no-repeat 50% 50%;background-size:cover}
html.login-red{background:url(../img/brbg2.jpg) no-repeat 50% 50% #fff}
html.login-red body{color:rgb(250,50,100) !important;}
html.login-red section label,
html.login-red fieldset{border-color:rgba(250,50,100,.5)}
html.login-red section input:focus,
html.login-red section #validateBar:hover,
html.login-red section menu button:active{background-color:rgba(250,50,100,.3)}
html.login-blue{background:url(../img/bg.desktop2.jpg) no-repeat fixed 50% 50% rgb(100,150,200);

background-size:cover}
html.login-blue body{color:#fff !important;}
html.login-blue mask{background:rgba(50,100,150,.7)}
html.login-blue section label,
html.login-blue fieldset{border-color:rgba(255,255,255,.3)}
html.login-blue section input:focus,
html.login-blue section #validateBar:hover,
html.login-blue section menu button:active{background-color:rgba(255,255,255,.1)}
html.login-gold body{color:#db6 !important}
html.login-gold section label,
html.login-gold section fieldset{border-color:rgba(238,204,119,.3)}
html.login-gold section input:focus,
html.login-gold section #validateBar:hover,
html.login-gold section menu button:active{background-color:rgba(238,204,119,.1)}
html.login-gold cover{background:url(../img/bg.desktop1.jpg) no-repeat 50% 50%}
html.login-gold mask{background:rgba(0,0,0,.5)}

html.fc5-index #hat,
html.mall #hat{position:relative}



/*----*/
.bg-fcb{background-color:rgba(250,50,100,.8);background-image:linear-gradient(90deg,rgb(250,50,100),rgb(100,150,200));color:rgb(255,255,255) !important;padding:0 .5em;color:rgb(255,255,255)}
.fcb:after{content:'\79ef\5206'}
.fc5iconfont{font-size:inherit}
/*----*/
.ballwrap a,
.ballwrap span,
.ballwrap strong,
.ballwrap em,
.ballwrap b,
.ballwrap tit{display:inline-block}
.ball{line-height:1rem;display:inline-flex;white-space:nowrap;}
.ball:after{content:'';visibility:hidden;display:block;font-size:0;clear:both;height:0}
.ball ball{flex:none;display:inline-block;border-radius:50%;background-color:rgb(250,50,100);color:rgb(255,255,255);width:1rem;height:1rem;line-height:1rem;font-size:.6rem;text-align:center;font-weight:700;margin:.25rem .15rem}
.ball-animation ball:hover{transform:translateY(-.1rem)}
.ball-animation ball{animation:rotate360 .6s linear}
.ball-animation ball:nth-child(1){animation-delay:.0s}
.ball-animation ball:nth-child(2){animation-delay:.1s}
.ball-animation ball:nth-child(3){animation-delay:.2s}
.ball-animation ball:nth-child(4){animation-delay:.3s}
.ball-animation ball:nth-child(5){animation-delay:.4s}
.ball-animation ball:nth-child(6){animation-delay:.5s}
.ball-animation ball:nth-child(7){animation-delay:.6s}
.ball-mask ball{background-image:-webkit-radial-gradient(50% 50%, circle cover, rgba(255,255,255,.2) 0, rgba(0,0,0,.1) 100%)}
.ball-border ball{line-height:.9rem;box-sizing:border-box;border:1px solid currentcolor; color:rgb(250,50,100);background:none !important}
.ball-15 ball{border-width:.1rem;width:1.5rem;height:1.5rem;line-height:1.5rem;font-size:.8rem}			
.ball-20 ball{border-width:.1rem;width:2rem;height:2rem;line-height:2rem;font-size:.9rem}			
.ball-25 ball{border-width:.1rem;width:2.5rem;height:2.5rem;line-height:2.5rem;font-size:1rem}
.ball-30 ball{border-width:.1rem;width:3rem;height:3rem;line-height:3rem;font-size:1.2rem}	
.ball-border.ball-15 ball{line-height:1.3rem}			
.ball-border.ball-20 ball{line-height:1.8rem}			
.ball-border.ball-25 ball{line-height:2.3rem}
.ball-border.ball-30 ball{line-height:2.8rem}
.ball-ssq ball:last-child,
.ball-dlt ball:nth-child(6),
.ball-dlt ball:nth-child(7){background-color:rgb(100,150,200)}
.ball-border.ball-ssq ball:last-child,
.ball-border.ball-dlt ball:nth-child(6),
.ball-border.ball-dlt ball:nth-child(7){color:rgb(100,150,200)}
/*----*/
.b-line{border-bottom:1px solid rgba(0,0,0,.1)}
.a-line a:after,
.a-line span:after{content:' | ';opacity:.3;margin:0 .5em}
.a-line a:last-child:after,
.a-line span:last-child:after{display:none}
.a-line strong{margin:0 .5em}
.a-line em{font-style:normal}
/*-----------------theme------------------*/
html.game{background:url(../img/gamebg.jpg) no-repeat 50% 0 rgb(0,10,30)}
html.game #header-nav{background:none}
html.game #footer{background:none;border-top:1px solid currentcolor}
html.game #hat{background-color:rgba(0,10,30,.8)}



.bg-bs{box-shadow:0 1px 2px rgba(0,10,30,.1);position: relative;z-index:2;}
.bg-lg{background-color:rgb(255,255,255);background-image:linear-gradient(rgb(255,255,255),rgb(235,235,235) 50%,rgb(255,255,255))}

.bg-light{background: url(../img/brbg.jpg) no-repeat 50% 100% #fff; background-size:100% auto;}
/*#hat-hul-li1>a big{background-image:linear-gradient(90deg,rgb(250,50,100),rgb(100,150,200));background-size:cover;-webkit-background-clip:text;-webkit-text-fill-color:transparent}
*/
#hat-hul-li1 ol>li>a{font-size:.8rem;overflow:hidden;}
#hat-hul-li1 ol>li>a>icon{opacity:.5}
#hat-hul-li1 ol>li>a:hover icon{opacity:1;color:rgba(250,50,100,1);text-shadow:0 .1rem .1rem rgba(250,50,100,.3)}

#HD{height:2rem;position:relative;}
#HD:before{content:'';height:4rem; width:12rem; background:url(../img/2.png) no-repeat 50% 50%;position: absolute;top:50%;left:50%; margin:-2rem 0 0 -6rem;opacity:.8;}
#HD logo{float:left;height:2rem;width:8rem;display:block}
#HD #fc5logo{width:100%;height:100%;/*fill:rgb(250,50,100)*/}
#HD a.btn-ydj{ background-color:rgb(255,255,255);font-size:.7rem;}
#icoNAV{margin-bottom:.5rem}
#icoNAV ul.iconavul a{color:rgb(250,50,100);text-shadow:0 .1rem .2rem rgba(250,50,100,.5)}
/**/
#contact{padding:1rem 0}
#contact dl{float:left}
#contact dt{line-height:2em;position:relative;display:flex;align-items:center}
#contact dt:after{content:'';height:1px;background-color:currentcolor;opacity:.3;flex:auto;margin-left:.5rem;}
#contact dd{line-height:2em;padding:1em 0}
#contact img{vertical-align:middle;max-width:100%}
#contact img.QRcode{width:6em;float:left;margin-right:1em;opacity:.5}
#contact a{color:inherit}

.bg-site,
.bg-kj,
.bg-ads1:before{background-color:rgb(255,255,255)}
.bg-ads0,
.bg-ads1{position:relative}
.bg-ads0:before,
.bg-ads1:before,
.bg-ads1:after{content:'';position:absolute;left:0;right:0;z-index:0;height:50%}

.bg-ads0:before,
.bg-ads1:before{top:0}
.bg-ads1:after{bottom:0}
.bg-news,
.bg-shop,
.bg-ads0:before,
.bg-ads1:after{background-color:rgb(245,245,245)}

.bg-one{background: url(../img/brbg2.jpg) no-repeat 50% -2.4rem rgb(255,255,255);background-size:100% auto;}

.bg-contact{background-color:rgba(0,10,30,.8);color:rgba(255,255,255,.5)}
.bg-tile{background-color:rgb(245,245,245)}

.bg-mall-shop,
.bg-mall-shop+.bg-ads0:before{background-color:rgb(245,245,245)}
.bg-playmore{background-color:rgba(0,10,30,.8);color:rgba(255,255,255,.8)}

@media screen and (max-width: 992px), screen and (max-width: 1280px){
.ball-15 ball{width:1.4rem;height:1.4rem;line-height:1.4rem;font-size:.7rem}			
.ball-20 ball{width:1.6rem;height:1.6rem;line-height:1.6rem;font-size:.8rem}			
.ball-25 ball{width:1.8rem;height:1.8rem;line-height:1.8rem;font-size:.9rem}
.ball-30 ball{width:2.4rem;height:2.4rem;line-height:2.4rem;font-size:1rem}
.ball-border.ball-15 ball{line-height:1.2rem}			
.ball-border.ball-20 ball{line-height:1.4rem}			
.ball-border.ball-25 ball{line-height:1.6rem}
.ball-border.ball-30 ball{line-height:2.2rem}
}

@media screen and (max-width: 768px), screen and (max-width: 991px){
.bg-light{background-size:auto}
}

@media screen and (max-width: 481px), screen and (max-width: 767px){
#HD:before{display:none}	
#SwiperHD{margin-top:0}
#SwiperHD .swiper-container{border-radius:0}
#SwiperHD .swiper-container:after{display:none}
}

@media screen and (max-width:320px),screen and (max-width:480px){
.bg-one{background-size:auto;}
#HD.mc-1x{margin-top:.5rem;margin-bottom:.5rem;height:1.5rem}
#HD,#HD .fr{display:none}	
#HD logo{float:none; margin:0 auto;width:6rem;height:1.5rem}
}