/* 
* @Author: Marte
* @Date:   2022-06-14 19:31:32
* @Last Modified by:   Marte
* @Last Modified time: 2022-07-02 13:50:19
*/
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td {padding: 0;margin: 0;}
ul,li{list-style: none;}
a{text-decoration: none;}
img{border:0;width:auto; height:auto;}
/*****清除浮动样式设置*****/
html {font-size: 62.5%;
    font-family: STHeiti, Arial, "Microsoft Yahei", "Hiragino Sans GB",
    "Simsun,sans-self";
    -ms-text-size-adjust: 100%;
  -webkit-text-size-adjust: 100%;}
.clearfix {display: block;zoom: 1;}
.clearfix:after,.clearfix:before{content: " ";display: block;font-size: 0;height: 0;clear: both; visibility: hidden;}
/*****高自动，超出部分隐藏*****/
.ht-over{ height: auto; overflow: hidden;}
.tl{text-align: left;}
.tc{ text-align: center;}
.tr{ text-align:right;}
.fontBold{ font-weight: bold;}

.border-box{-webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box;}
.border-box:before,.border-box:after {-webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box;}
.table{color:#444c63;}

/*****设置为块元素*****/
.block{display: block;}
.lineBlock{display: inline-block;}
/*****设置包裹容器*****/
/*.container { width: 950px;margin: 0 auto;}
.headcontainer{width:1200px;margin:0 auto;}*/
/*****清除浮动样式设置**** */
.clearfix {display: block;zoom: 1;}
.clearfix:after,.clearfix:before{content: " ";display: block;font-size: 0;height: 0;clear: both; visibility: hidden;}
.float-lf, .fl{float: left;}
.float-rt, .fr{float: right;}
/*文字对齐*/
.tl{ text-align: left;}
.tr{ text-align: right;}
.tc{ text-align: center;}
/******高自动，超出部分隐藏*****/
.ht-over{ height: auto; overflow: hidden;}
.img-auto img {width: 100%; height: auto;}
.position {position: relative;}

body {width: 100%; height: auto; }
.container{width: 1200px; margin: 0 auto;}
.wrap{width:100%;max-width: 750px; margin: 0 auto;min-height:100vh;background: url('../images/bg.jpg'); 
    background-size: 100% 100%; position:relative; padding-bottom: 40px;}
.banner-img img {margin-top: 8%;}
.logo {width: 36%;position: absolute;left: 32%;top: 0.5%;}
.introduce {width: 95%;margin-left: 2%; margin-top: -15%;}
.download {width:46%;margin: 8px auto;}
.nice {width:82%;margin: -8% auto 0;}
.line {width: 92%; margin: 0 auto;}
.down-text {width: 91%;margin: 5px auto;}
.download img {
    animation: scaleImg .5s ease-in alternate-reverse infinite;
}

.line-item {
    height: 28px;
    line-height: 28px;
    width: 87.5%;
    background: url('../images/2885_15.png') top center no-repeat;
    background-size: 100% 100%;
    margin: 9px auto;
    padding: 1px;
    display: flex;
    justify-content: space-between; font-weight: bold;
}
.line-item .line-lf {
    width: 17.5%;
    height: 27px;
    /*background: url('../images/timebg.png') repeat-x;border-top-left-radius: 30px;*/
    border-bottom-left-radius: 30px;
    margin-left: 1px;
    position: relative;color:#ffffff; font-weight: bold;
}
.line-item .line-lf em {
    font-style: normal;
}
/* .line-lf:after {
    content: '';
    position: absolute;
    right:-12px;
    top: 7px;
    width: 0;
    height: 0;
    border: 6px solid;
    border-color: transparent transparent transparent #ef2b14;
} */
.line-item .line-ct { flex: 1;color: #4c4834; font-size: 15px; text-indent: 15px; font-weight: 500;}
.line-item .line-rt img {height: 25px;width: auto; margin-top:1px;}
.commont-title {width: 54%;margin:3px auto 8px;}
.hot-game {width: 92%;margin: 0 auto; position: relative;}
.hot-game a{display: block; width: 48%;}
.hot-game a:nth-child(even) {float: right;}
.hot-game a:nth-child(odd) {float: left;}
.hot-game .link-box{ position: absolute; left:0; top: 0;width: 100%;height:100%;}
.hot-game .link-box a {height: 5%;padding: 7% 0;margin-top: 3%;line-height: 100%;}
.cut-img {width: 90%;margin: 0 auto;border: 1px solid #ffed96;}
.cut-img img {}


.swiper {
    width: 100%;
    height: 100%;
}

.swiper-slide {
    text-align: center;
    font-size: 18px;
    background: #fff;
    /* Center slide text vertically */
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    align-items: center;
}

.swiper-slide img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.margin-bottom{ margin-bottom: 6%;}
.chat-box {width:87.5%;margin: 4px auto;}
.chat-box li{display:flex; color:#ffffff;border-bottom: 1px dashed #3f3f3f; padding: 10px 0;}
.chat-box li .chat-text { flex: 1;}
.chat-box img { width: 40px;height: 40px;margin-right: 8px;}
.chat-box .name {font-size: 13px; line-height: 18px;}
.chat-box .time { font-size: 10px; color:#828282; margin-top: 1px;}
.chat-box p{ font-size: 12px;margin-top: 3px;}
.service {width: 17%; max-width: 98px; position:fixed;right:0;top:15%; z-index: 100;}
.animated {
    -webkit-animation-duration: 1s;
    animation-duration: 1s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
}
@keyframes scaleImg {
    0% {
        transform: scale(.9);
    }
    100% {
        transform: scale(1.1);
    }
}
@-webkit-keyframes zoomInDown {
    0% {
        opacity: 0;
        -webkit-transform: scale(.1) translateY(-2000px);
        transform: scale(.1) translateY(-2000px);
        -webkit-animation-timing-function: ease-in-out;
        animation-timing-function: ease-in-out
    }

    60% {
        opacity: 1;
        -webkit-transform: scale(.475) translateY(60px);
        transform: scale(.475) translateY(60px);
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out
    }
}

@keyframes zoomInDown {
    0% {
        opacity: 0;
        -webkit-transform: scale(.1) translateY(-2000px);
        -ms-transform: scale(.1) translateY(-2000px);
        transform: scale(.1) translateY(-2000px);
        -webkit-animation-timing-function: ease-in-out;
        animation-timing-function: ease-in-out
    }

    60% {
        opacity: 1;
        -webkit-transform: scale(.475) translateY(60px);
        -ms-transform: scale(.475) translateY(60px);
        transform: scale(.475) translateY(60px);
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out
    }
}

.zoomInDown {
    -webkit-animation-name: zoomInDown;
    animation-name: zoomInDown
}

@keyframes slideInLeft {
    0% {
        opacity: 0;
        -webkit-transform: translateX(-2000px);
        -ms-transform: translateX(-2000px);
        transform: translateX(-2000px)
    }

    100% {
        -webkit-transform: translateX(0);
        -ms-transform: translateX(0);
        transform: translateX(0)
    }
}

.slideInLeft {
    -webkit-animation-name: slideInLeft;
    animation-name: slideInLeft
}

@-webkit-keyframes slideInRight {
    0% {
        opacity: 0;
        -webkit-transform: translateX(2000px);
        transform: translateX(2000px)
    }

    100% {
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }
}

@keyframes slideInRight {
    0% {
        opacity: 0;
        -webkit-transform: translateX(2000px);
        -ms-transform: translateX(2000px);
        transform: translateX(2000px)
    }

    100% {
        -webkit-transform: translateX(0);
        -ms-transform: translateX(0);
        transform: translateX(0)
    }
}

.slideInRight {
    -webkit-animation-name: slideInRight;
    animation-name: slideInRight;
}

@media screen and (min-width: 500px) {
    .chat-box img {width: 60px;height:60px; margin-right: 10px;}
    .chat-box .name {font-size: 15px; line-height: 23px;}
    .chat-box .time { font-size: 12px;  margin-top: 5px;}
    .chat-box p{margin-top: 9px; font-size: 15px;}
}