/*body{
    background-size:100%;
    background-image: url('/bg.jpg');
}
body>div{
    opacity: 0.6;
}
div{
    border: solid 1px #F00;
}
*/
/* 超小屏幕（手机，小于 768px） */
@font-face {
    font-family: verdana;
    src: url('/assets/font/verdana.ttf');
}
@font-face {
    font-family: erasbd;
    src: url('/assets/font/Eras Bold ITC.TTF');
}
@font-face {
    font-family: eras;
    src: url('/assets/font/ERASDEMI.TTF');
}
@font-face {
    font-family: trebuchet;
    src: url('/assets/font/Trebuchet MS');
}

html{
    font-size: 12px;
    overflow-x:hidden;
    text-align: center;
}
#main-content{
    font-size: 1rem;
}
/*header begin*/
#header{
    width:100%;
    position: fixed;
    background-color: #f1f1f1;
    height: 3.7rem;
    font-size: 1rem;
}
#header .container{
    width: 100%;
}
#logo{
    float: left;
    height: 3.7em;
}
#logo>img{
    height: 100%;
    margin-left: 0.6rem;
}
.nav{
    font-family: tahoma, arial, 'Hiragino Sans GB', 'Microsoft Yahei', 宋体 ;
    background-color: #f1f1f1;
    padding-top: calc((3.7rem - 50px) / 2);
}
.navbar{
    margin-bottom: 0px;
    height: 3.7em;
    background-color: #f1f1f1;
}
.navbar-toggle{
    padding: 0;
    margin-top: 0.35em;
}
.navbar .nav>li>a {
    color: #777;
    text-decoration: none;
    text-shadow: 0 1px 0 #fff;
}
#bs-navbar{
    border: none;
}
.navbar-nav {
    margin: 0 -15px;
}
.glyphicon-menu-hamburger:before {
    color: #f8aa32;
    font-size: 1.67em;
    line-height: 1.67em;
}
.glyphicon-remove{
    display: none;
    color: #f8aa32;
    font-size: 1.67em;
    line-height: 1.67em;
}
/*header end*/

#content{
    margin-left:auto;
    margin-right:auto;
    background-color: #f1f1f1;
    padding-top: 3.7rem;
}
.game-item{
    clear:both;
}
.game-pic-div{
    position: relative;
    width:100%;
}
.game-intro-div{
    width:100%;
}

.game-item:nth-child(even) .game-pic-div,.game-item:nth-child(odd) .game-intro-div{
    float:right;
    background-color: #f1f1f1;
}
.game-item:nth-child(even) .game-intro-div,.game-item:nth-child(odd) .game-pic-div{
    float:left;
    background-color: #f1f1f1;
}

.game-title,.game-title-detail{
    font-family: erasbd,"Microsoft YaHei",微软雅黑;
    font-size: 1.41rem;
    margin-top: 1rem;
}

@media screen and (max-width: 1200px){
    #main-content{
        padding: 0;
    }
    .container{
        width: 100%;
    }
}
@media screen and (max-width: 992px) and (min-width: 768px){
    .game-title,.game-title-detail{
        font-size: 2.2rem;
    }
}
@media screen and (min-width: 992px){
    .game-intro-div,.game-pic-div{
        width:50%;
    }
}
@media screen and (min-width: 1200px) {
    html{
        font-size: 22px;
    }
    #header {
        width: 1200px;
        font-size: 0.7rem;
        height: 2.59rem/*calc(3.7rem * 0.7);*/;
        margin-left: -600px;
        left:50%;
    }
    #content{
        width: 1200px;
        padding-top: 2.59rem/*calc(3.7rem * 0.7);*/;
    }
    .nav{
        padding-top: calc((3.7rem * 0.7 - 50px) / 2);
    }
    #footer{
        width: 1200px;
    }
}

@media screen and (min-width: 1600px) {
    html{
        font-size: 22px;
    }
    #header {
        width: 1600px;
        font-size: 0.8rem;
        height: 2.96rem/*calc(3.7rem * 0.8);*/;
        margin-left: -800px;
        left:50%;
    }
    #content{
        width: 1600px;
        padding-top: 2.96rem/*calc(3.7rem * 0.8);*/;
    }
    #footer{
        width: 1600px;
    }
    .nav{
        padding-top: calc((3.7rem * 0.8 - 50px) / 2);
    }
}

.game-pic{
    width:100%;
}
.game-logo,.game-logo-detail{
    margin-top: 4rem;
}
.game-logo img,.game-logo-detail>img{
    width: 30%;
}

.game-intro{
    color:#727272;
    text-align: left;
    font-family: verdana,"Microsoft YaHei",微软雅黑;
    font-size: 1rem;
    padding: 0 18%/*vw*/;
    margin-top: 2rem;
    line-height: 1.75;
}

.readmore{
    margin: 2rem 0;
}

.btn-readmore,.btn-readmore:hover{
    background-color: #ff950a;
    border-radius: 0;
    border: none;
    color: #fff;
    font-size: 1rem;
    padding: 0.65rem 1.1rem;
    margin: 0;
    font-family: eras;
}

@media(max-width:768px){
    .col-lg-1, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-md-1, .col-md-10, .col-md-11, .col-md-12, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-sm-1, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-xs-1, .col-xs-10, .col-xs-11, .col-xs-12, .col-xs-2, .col-xs-3, .col-xs-4, .col-xs-5, .col-xs-6, .col-xs-7, .col-xs-8, .col-xs-9 {
        padding-right: 5px;
        padding-left: 5px;
    }
}

/* 中等屏幕（桌面显示器，大于等于 992px） */
@media (min-width: 992px) {
    .game-logo{
        margin-top: 1rem;
    }
    .game-logo>img{
        width: 30%;
    }
    .game-intro{
        font-size: 1rem;
        padding: 0 4%/*2vw*/;
        margin-top: 1rem;
        overflow: hidden;
        height: 1.75rem;
    }
    .readmore{
        margin: 1.1rem 0;
    }
}

/*game detail begin*/
#download-div{
    padding: 50px 0;
    margin: auto;
    text-align: center;
}
.download{
    width: 20%;
    display: inline-block;
    margin: 20px;
}
.download img{
    width: 100%;
}
@media (max-width: 768px) {
    .download{
        width: 35%;
        margin: 4%;
    }
}

#detail-game-pic-div {
    /*overflow-x: scroll;*/
    /*overflow-y: hidden;*/
    overflow: hidden;
    /*padding: 0.2em 0 1em 0;*/
    padding: 0.2em 0;
    border-top: solid #dcdcdc 1px;
    border-bottom: solid #dcdcdc 1px;
    background-color: #f7f7f7
}
#detail-game-pic-window {
    width: 500%;
}
.detail-game-pic {
    width: auto;
    float: left;
    margin: 10px 13px 10px 4px;
    /*max-width: 50%;*/
}
.detail-game-pic img{
    /*margin: 2px;*/
    /*border: 1px solid #fff;*/
    /*-webkit-box-shadow: 0 3px 5px rgba(0,0,0,.3);*/
    /*-moz-box-shadow: #999 0 3px 5px;*/
    max-width: 98vw;
}

#game-intro-div{
    width: 70%;
    margin: auto;
}
#game-intro{
    padding: 0;
    height: auto;
}
#scroll-div{
    height: 20px;
    margin-top:-20px;
    background-color: #f1f1f1;
    border-top: solid #dcdcdc 1px;
}
@media screen and (max-width: 1680px){
    .detail-game-pic img {
        max-height: 622px;/*calc(728px - 4rem);*/
    }
    @media screen and (max-width: 1280px){
        .detail-game-pic img {
            max-height: 484px;/*calc(576px - 4rem);*/
        }
        @media only screen and (max-width: 1023px){
            .detail-game-pic img {
                max-height: 610px;/*calc(690px - 4rem);*/
            }
            @media only screen and (max-width: 767px){
                .detail-game-pic img {
                    max-height: 417px;/*calc(465px - 4rem);*/
                }
            }
        }
    }
}
/*game detail end*/

/*footer begin*/
#footer{
    clear:both;
    font-family: trebuchets,"Microsoft YaHei",微软雅黑;
    color:#f8aa32;
    background-color: #f8f8f8;
    text-align: left;

    font-size: 0.87rem;
    line-height: 1.36rem;
    padding: 1.36rem 0 2.18rem 3.27rem;
    margin: auto;
}
#footer a{
    color:#f8aa32;
    text-decoration: none;
}
.icp{
    font-size: 0.87rem;
}
.footer-link img{
    width: 40px;
}
@media screen and (min-width: 992px){
    #footer{
        text-align: center;
        padding: 0;
    }
    .footer-link{
        display: inline-block;
        margin: auto;
        padding: 50px 20px 30px 20px;
    }
    .icp{
        padding-top: 20px;
        font-size: 0.55rem;
    }
}
/*footer end*/