@charset "utf-8";
/* CSS Document */
html { font-family: "Helvetica Neue", Helvetica, STHeiTi, Arial, sans-serif; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; font-size: 62.5%; }
body { margin: 0; font-size: 1.4rem; line-height: 1.5; color: #333333; background-color: #f7f7f7; height: 100%; overflow-x: hidden; -webkit-overflow-scrolling: touch; -webkit-text-size-adjust: none; word-wrap: break-word; word-break: keep-all; -webkit-user-select: none; -webkit-touch-callout: none;  -webkit-tap-highlight-color: rgba(0,0,0,0); -webkit-font-smoothing: antialiased; cursor: default;}

article, aside, details, figcaption, figure, footer, header, hgroup, main, nav, section, summary { display: block; }
audio, canvas, progress, video { display: inline-block; vertical-align: baseline; }
audio:not([controls]) { display: none; height: 0; }
[hidden], template { display: none; }
svg:not(:root) { overflow: hidden; }

a { background: transparent; text-decoration: none; -webkit-tap-highlight-color: transparent; color: #0088cc; }
a:active { outline: 0; }
a:active { color: #006699; }
abbr[title] { border-bottom: 1px dotted; }
b, strong { font-weight: bold; }
dfn { font-style: italic; }
mark { background: #ff0; color: #000; }
small { font-size: 80%; }
sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; }
sup { top: -0.5em; }
sub { bottom: -0.25em; }
img { border: 0; vertical-align: middle; }
hr { -moz-box-sizing: content-box; box-sizing: content-box; height: 0; }
pre { overflow: auto; white-space: pre; white-space: pre-wrap; word-wrap: break-word; }
code, kbd, pre, samp { font-family: monospace, monospace; font-size: 1em; }

button, input, optgroup, select, textarea { color: inherit; font: inherit; margin: 0; }
button { overflow: visible; }
button, select { text-transform: none; }
button, html input[type="button"], input[type="reset"], input[type="submit"] { -webkit-appearance: button; cursor: pointer; }
button[disabled], html input[disabled] { cursor: default; }
button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0; }
input { line-height: normal; }
input[type="checkbox"], input[type="radio"] { box-sizing: border-box; padding: 0; }
input[type="number"]::-webkit-inner-spin-button, input[type="number"]::-webkit-outer-spin-button { height: auto; }
input[type="search"] { -webkit-appearance: textfield; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; }
input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration { -webkit-appearance: none; }
fieldset { border: 1px solid #c0c0c0; margin: 0 2px; padding: 0.35em 0.625em 0.75em; }
legend { border: 0; padding: 0; }
textarea { overflow: auto; resize: vertical; }
optgroup { font-weight: bold; }

table { border-collapse: collapse; border-spacing: 0; }
td, th { padding: 0; }

.thickdiv {  position: fixed; top: 0; left: 0; width: 100%;  height: 100%; background:#0D2026; border: 0 none; opacity: 0.8; filter:alpha(opacity=80); z-index:101;}

html, button, input, select, textarea { font-family: "Helvetica Neue", Helvetica, STHeiTi, Arial, sans-serif; }
h1, h2, h3, h4, h5, h6, p, figure, form, blockquote { margin: 0; }
ul, ol, li, dl, dd { margin: 0; padding: 0; }
ul, ol { list-style: none outside none; }
h1, h2, h3 { line-height: 2; font-weight: normal; }
h1 { font-size: 1.8rem; }
h2 { font-size: 1.6rem; }
h3 { font-size: 1.4rem; }
input::-moz-placeholder, textarea::-moz-placeholder { color: #cccccc; }
input:-ms-input-placeholder, textarea:-ms-input-placeholder { color: #cccccc; }
input::-webkit-input-placeholder, textarea::-webkit-input-placeholder { color: #cccccc; }
.fl, .fr { display: inline; float: left; }

.fr { float: right; } 

.pr{ position:relative; }

.pa{ position:absolute; }

@font-face {
      font-family: 'HKE-M';     
      src: url("//png.pookcdn.net/hw/studio/newmobile/fonts/HKExplorerSharp-Medium.otf") format('truetype');
      font-weight: normal;
      font-style: normal;
 }
@font-face {
      font-family: 'HKE-R';     
      src: url("//png.pookcdn.net/hw/studio/newmobile/fonts/HKEXPLORERSHARP-REGULAR.OTF") format('truetype');
      font-weight: normal;
      font-style: normal;
 }
@font-face {
      font-family: 'HKE-S';     
      src: url("//png.pookcdn.net/hw/studio/newmobile/fonts/HKEXPLORERSHARP-SEMIBOLD.OTF") format('truetype');
      font-weight: normal;
      font-style: normal;
 }
 
.nav-top {position: fixed;display: flex;height: 1.1rem;background: #dc1e14;z-index: 104;align-items: center;justify-content: space-between;width: 7.5rem;-webkit-transform: translateX(-50%);top: 0;left: 50%;transform: translateX(-50%);}
.nav-top .logo { margin-left: .4rem; height: .9rem; }
.nav-top .btn-recharge { float: right;  margin-top: .2rem; margin-right: 0.2rem; width: 1.1rem;  height: .48rem;
 font-size: .34rem; border: .02rem #7e7e7e solid; color: #7e7e7e; text-align: center; line-height: 1.4;  -webkit-border-radius: .5rem;
 -moz-border-radius: .5rem;  border-radius: .5rem;}
.nav-top .btn-login { float: right;  margin-top: .2rem; margin-right: 0.7rem; width: 0.7rem;  height: .48rem; font-size: .34rem;color: #7e7e7e; text-align: center; 
line-height: 1.4;  -webkit-border-radius: .5rem; -moz-border-radius: .5rem; border-radius: .5rem;}
.nav-top .sltx { float: right;  margin-top: .4rem; margin-right: .5rem; width: 3rem;  height: .48rem; font-size: .20rem;
color: #ff2a00; text-align: center; line-height: 1.4;  -webkit-border-radius: .5rem; -moz-border-radius: .5rem; border-radius: .5rem;}
.nav-top .split { float: right;  margin-top: .2rem; margin-right: 0.05rem; width: 0.1rem;  height: .48rem; font-size: .34rem;
color: #7e7e7e; text-align: center; line-height: 1.4;  -webkit-border-radius: .5rem; -moz-border-radius: .5rem; border-radius: .5rem;}
.nav-top .btn-reg { float: right;  margin-top: .2rem; width: 0.7rem;  height: .48rem; font-size: .34rem;color: #7e7e7e; text-align: center; line-height: 1.4;  
-webkit-border-radius: .5rem; -moz-border-radius: .5rem; border-radius: .5rem;}
.nav-top .change-btn{ display: flex; width: 1.16rem; height: 1.1rem; background: #fff; align-items: center; justify-content: center;} 
.nav-top .change-btn span{ display: box; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex;  top: .4rem;
 right: .3rem; width: .45rem; height: .32rem; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; 
 flex-direction: column; justify-content: space-between; -webkit-box-pack: justify; -moz-box-pack: justify; box-pack: justify; }
.nav-top .change-btn i { display: block; background: #dc1e14;  width: .45rem; height: .07rem;
-webkit-transition: all .2s ease-in-out; -moz-transition: all .2s ease-in-out; -ms-transition: all .2s ease-in-out; transition: all .2s ease-in-out;
 background-repeat: no-repeat; background-size: 100% 100%; }
.nav-top .change-btn i:nth-child(3) { width: .3rem; }
.nav-top .change-btn.cur i:nth-of-type(1) {  -webkit-transform: rotate(45deg) translate(0.08rem, .1rem); -moz-transform: rotate(45deg) translate(0.08rem, .1rem);
 -ms-transform: rotate(45deg) translate(0.08rem, .1rem); transform: rotate(45deg) translate(0.08rem, .1rem);}
.nav-top .change-btn.cur i:nth-of-type(3) { display: none; }
.nav-top .change-btn.cur i:nth-of-type(2) {  -webkit-transform: rotate(-45deg) translate(0.1rem, -.1rem);
 -moz-transform: rotate(-45deg) translate(0.1rem, -.1rem); -ms-transform: rotate(-45deg) translate(0.1rem, -.1rem); transform: rotate(-45deg) translate(0.1rem, -.1rem);}
.nav-list { position: fixed; display: none; left: 50%; top: 1.1rem; bottom: 0; width: 7.5rem; height: 100%; z-index: 103; box-sizing: border-box; }
.nav-show { -webkit-animation: bounceInLeft .5s 0s ease-in-out both; animation: bounceInLeft .5s 0s ease-in-out both }
.nav-list .content{ float: right; display: flex; display: -webkit-flex; padding-left: .5rem; width: 5.6rem; height: 100%; background: #dc1e14; box-sizing: border-box; -webkit-flex-flow: column; flex-flow: column; }
.nav-list ul { margin-top: .8rem; height: 50%;}
.nav-list ul li { height: 1.3rem; font-size: .54rem; color: #353535; font-family: 'HKE-M'; line-height: 3.3; letter-spacing: 1px;}
.nav-hide { -webkit-animation: fadeOutRight .5s 0s ease-in-out both; animation: fadeOutRight .5s 0s ease-in-out both; }
.nav-list ul li a { color: #fff; }
.ico-list{ display: flex; display: -webkit-flex;}
.nav-list .ico-list{ height: 20%;}
.ico-list a{ margin-right: .28rem; width: .67rem; height: .66rem; background-repeat: no-repeat; background-size: 100% 100%;}
.nav-list .ico-list a.ico-fb{ background-image: url(//png.pookcdn.net/hw/studio/newmobile/ico_fb.png);}
.nav-list .ico-list a.ico-tw{ background-image: url(//png.pookcdn.net/hw/studio/newmobile/ico_tw.png);}
.nav-list .ico-list a.ico-in{ background-image: url(//png.pookcdn.net/hw/studio/newmobile/ico_in.png);}
.nav-list .ico-list a.ico-mail{ background-image: url(//png.pookcdn.net/hw/studio/newmobile/ico_mail.png);}
.nav-list .text{ font-family:"microsoft yahei"; font-size: .2rem; color: #fff; line-height: 1.5;}

.wrapper{ margin: 0 auto; width: 7.5rem; font-family: 'HKE-R'; font-size: .21rem;color: #777;}

.btn{ display: block; width: 2.15rem; height: .58rem; background: #dc1e14; font-size: .26rem; color: #fff; text-align: center; line-height: .58rem; -webkit-border-radius: .4rem; border-radius: .4rem; -webkit-transition: all 1s; transition: all 1s;}
.btn-auto{ margin: 0 auto!important;}
/*.btn:hover{ -webkit-transform: scale(.95); transform: scale(.95);}*/

.item-title{ margin-left: .85rem; font-size: .58rem; font-family: 'HKE-S';   color: #363636;}
.item-title:after{ content: ""; position: absolute; top: 50%; left: -.4rem; width: .2rem; height: 90%; background: #dc1e14; -webkit-transform: translateY(-60%); transform: translateY(-60%); -webkit-border-radius: .2rem; border-radius: .2rem;}
.item-title span{ display: block; font-size: .33rem; font-family: 'HKE-R'; color: #636363;}

.content-banner{ margin-top: 1.1rem;}
.swiper-slide img{ width: 100%;}
.swiper-pagination{ left: initial!important; right: .5rem; bottom: .2rem!important; display: flex; display: -webkit-flex; -webkit-justify-content: flex-end; justify-content: flex-end; -webkit-align-items: center; align-items: center;}
.swiper-pagination .swiper-pagination-bullet{ width: .16rem!important; height: .16rem!important; background: #fff; opacity: 1;}
.swiper-pagination .swiper-pagination-bullet-active{ width: .23rem!important; height: .23rem!important; background: #dc1e14;}

.content-contact .item-title{ margin-bottom: .8rem;}
.content-contact .item-input{ position: relative; margin:0 auto .3rem; width: 5.1rem; height: .77rem; background: #fff; line-height: .77rem; -webkit-border-radius: .5rem; border-radius: .5rem; box-shadow: 0 0 .2rem rgba(170,170,170,.2);}
.content-contact .item-input:after{ content: ""; position: absolute; top: 50%; right: .35rem; margin-top: -.15rem; width: .13rem; height: .3rem; background: url(//png.pookcdn.net/hw/studio/newmobile/ico_input_arrow.gif) no-repeat; background-size: 100% 100%;}
.content-contact .item-input input{ padding: 0 .5rem; width: 100%; height: 100%; font-size: .28rem; border: none; box-sizing: border-box; outline: none; -webkit-border-radius: .5rem; border-radius: .5rem;}
.content-contact .btn{ margin-top: .35rem; width: 2.55rem;}
.content-contact .doll{ display: block; margin:.2rem auto 1rem; width: 3.87rem;}

.content-footer{ padding: .35rem .35rem 1.3rem; background: #1c1c1c; color: #757575; box-sizing: border-box;}
.content-footer .text-intro{ padding: 0 .2rem .2rem; font-size: .32rem; text-align: center; line-height: 1.8; box-sizing: border-box; border-bottom: .02rem #757575 solid;}
.content-footer .text-list{ margin: .5rem auto .35rem; width: 100%; text-align: center;}
.content-footer .text-list a{ margin: 0 .3rem; font-size: .27rem; color: #fff;}
.content-footer .ico-list{ -webkit-justify-content: center; justify-content: center;}
.content-footer .ico-list a.ico-fb{ background-image: url(//png.pookcdn.net/hw/studio/newmobile/ico_fb_grey.png);}
.content-footer .ico-list a.ico-tw{ background-image: url(//png.pookcdn.net/hw/studio/newmobile/ico_tw_grey.png);}
.content-footer .ico-list a.ico-in{ background-image: url(//png.pookcdn.net/hw/studio/newmobile/ico_in_grey.png);}
.content-footer .ico-list a.ico-mail{ background-image: url(//png.pookcdn.net/hw/studio/newmobile/ico_mail_grey.png);}
.content-footer .text-state{ margin-top: .55rem; font-size: .24rem; text-align: center;}

@-webkit-keyframes bounceInLeft {
    0%,
    60%,
    75%,
    90%,
    100% {
        -webkit-transition-timing-function: cubic-bezier(0.215, .61, .355, 1)
    }
    0% {
        opacity: 1;
        filter: alpha(opacity=10);
        -webkit-transform: translate3d(100%, 0, 0)
    }
    100% {
        -webkit-transform: translate3d(-50%, 0, 0)
    }
}

@keyframes bounceInLeft {
      0%,
    60%,
    75%,
    90%,
    100% {
        transition-timing-function: cubic-bezier(0.215, .61, .355, 1)
    }
    0% {
        opacity: 1;
        filter: alpha(opacity=10);
        transform: translate3d(100%, 0, 0)
    }
    100% {
        transform: translate3d(-50%, 0, 0)
    }
}

@-webkit-keyframes fadeOutRight {
    0% {
        opacity: 1;
        filter: alpha(opacity=100)
    }
    100% {
        opacity: 0;
        filter: alpha(opacity=0);
        -webkit-transform: translate3d(100%, 0, 0)
    }
}

@keyframes fadeOutRight {
    0% {
        opacity: 1;
        filter: alpha(opacity=100)
    }
    100% {
        opacity: 0;
        filter: alpha(opacity=0);
        transform: translate3d(100%,0, 0)
    }
}