@charset "utf-8";

.container{
    /* 四周外边距20px，和浏览器窗口留出空隙 */
    margin: 2rem;
    /* 宽度 = 100% - 左右margin(20*2) */
    width: calc(100% - 4rem);
    /* 高度 = 100% - 上下margin(20*2) */
    height: calc(100% - 4rem);
    overflow: hidden;
    padding: 2rem 4rem;
    border: #eee 1px solid;
    position: relative;
}

.fullbtn {
    position: absolute;
    right: 2rem;
    bottom: 2rem;
    z-index: 1;
    padding: 1rem 1rem;
    cursor: pointer;
    background: #2A7B9B;
    background: linear-gradient(90deg, rgba(42, 123, 155, 1) 0%, rgba(87, 199, 133, 1) 100%);
    border-radius: 1rem 0px 0px 0px;
    color: #fff;
}

.fullbtn .title{
    margin-bottom: .4rem;
    line-height: 1;
    font-size: 1rem;
    font-family: "siyuan-medium";
}

.fullbtn .text{
    line-height: 1;
    font-size: .7rem;
    font-family: "siyuan-medium";
}

.gamename{
    text-align: center;
    line-height: 1;
    font-size: 2rem;
    color: var(--title-color);
}

.time{
    text-align: right;
    min-width: 7rem;
    overflow: hidden;
    color: var(--title-color);
}

.time .title{
    line-height: 1;
    font-size: 1rem;
}

.time .number{
    line-height: 1.4;
    font-size: 1.2rem;
    font-family: 'Montserrat-reg';
}

.main{
    overflow: hidden;
    margin-bottom: 3rem;
}

.main .left,
.main .right{
    min-width: 10rem;
    overflow: hidden;
}

.main .left{
    text-align: right;
}

.main .right{
    text-align: left;
}

.main .left .item,
.main .right .item{
    margin-bottom: 4rem;
}

.main .left .item:last-child,
.main .right .item:last-child{
    margin-bottom: 0px;
}

.main .left .item .title,
.main .right .item .title{
    margin-bottom: .2rem;
    line-height: 1;
    font-size: 1.4rem;
}

.main .left .item .text,
.main .right .item .text{
    margin-bottom: .6rem;
    line-height: 1;
    font-size: 0.94rem;
    font-family: 'arial_black'; 
}

.main .left .item .value,
.main .right .item .value{
    text-align: right;
    line-height: 1;
    font-size: 2rem;
    font-family: 'arial_black'; 
}

.main .center{
    border-left: #eee 1px solid;
    border-right: #eee 1px solid;
    overflow: hidden;
    margin: 0px 2rem;
    padding: 0px 3rem;
}

.main .center .countdown{
    margin-bottom: 2rem;
    text-align: center;
    line-height: 1;
    font-size: 12rem;
    font-weight: 700;
    font-family: 'arial_black'; 
}

.main .center .item{
    overflow: hidden;
    margin-bottom: 1.4rem;
}

.main .center .item:last-child{
    margin-bottom: 0px;
}

.main .center .item .title{
    line-height: 1;
    font-size: 2rem;
}

.main .center .item .text{
    line-height: 1.6;
    font-size: 1.1rem;
    font-family: 'arial_black'; 
}

.main .center .item .value{
    text-align: right;
    line-height: 1;
    font-size: 3.6rem;
    font-family: 'arial_black'; 
}

.main .center .item .value.small{
    font-size: 2.6rem;
}

.notice{
    text-align: center;
    line-height: 1;
    font-size: 1rem;
}