body {
    margin: 0;
}
#app {
    position: relative;
}
.inhotel-smartTV-container {
    position: relative;
    width: 100vw;
    height: 56.25vw;
    background-size: cover;
    background-color: #171e2d;
    z-index: -9;
}
.inhotel-smartTV-content {
    padding: 5.61vw 10.02vw 8.97vw;
}
.inhotel-staff-img-box {
    width: 12.02vw;
    height: 12.02vw;
    border-radius: 50%;
    background-color: #ffb400;
}
.inhotel-staff-img {
    width: 11.7vw;
    height: 11.7vw;
    border-radius: 50%;
    background-color: #fff;
}
.inhotel-staff-title {
    margin-top: 1.6vw;
    font-size: 1.36vw;
    color: #fff;
}
.inhotel-staff-name {
    font-size: 1.36vw;
    width: 10.9vw;
    color: #fff;
    font-weight: bold;
    overflow: hidden;
    text-overflow : ellipsis;
    white-space: nowrap;
}
.inhotel-smartTV-server-type {
    font-size: 4.81vw;
    margin-left: 18.59vw;
    color: #ffb400;
}
.inhotel-smartTV-server-type div {
    text-align: center;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}
.inhotel-smartTV-server-status {
    margin-top: 5.13vw;
}
.tc {
    text-align: center;
}
.inhotel-smartTV-tip {
    font-size: 1.44vw;
    margin-top: 4.41vw;
    color: #fff;
}
.inhotel-staff-name-text {
    color: #fff;
    font-weight: bold;
    margin: 0 0.4vw;
}
.inhotel-tip-phone {
    margin-top: 1.52vw;
}
.mt0 {
    margin-top: 0
}
.inhotel-tip-welcome {
    color: #ffb400;
    margin-top: 1.12vw;
    font-size: 2.72vw;
}
.inhotel-steps {
    position: relative;
    margin: 5.13vw auto 0 auto;
    text-align: center;
}
.inhotel-steps:before{
    position: absolute;
    content: '';
    width: 47vw;
    height: 0.08vw;
    background-color: #ffb400;
    left: 16.4vw;
    top: -0.58vw;
}
/*步骤描述*/
.inhotel-steps .inhotel-steps-content {
    text-align: center;
    position: relative;
    display: inline-block;
    color: #fff;
    width: 14.9vw;
    font-size: 1.2vw;
}

/*步骤圆圈*/
.inhotel-steps .inhotel-steps-content:before {
    display: block;
    position: absolute;
    left: 6.58vw;
    top: -1.92vw;
    content: '';
    background-color: #fff;
    border-radius: 50%;
    width: 1.6vw;
    height: 1.6vw;
}

/*将当前/完成步骤之后变色*/
.inhotel-steps .inhotel-steps-content.active:before {
    background-color: #ffb400;
}
.hid {
    display: none;
}
.inhotel-smartTV-index {
    position: relative;
    background-image: url('https://lc-static.rezenhotels.com/h5/inscane/inhotel-smartTV-index-4.png');
    background-size: 100% 100%;
    width: 100vw;
    height: 56.25vw;
}
.inhotel-mini-code {
    position: absolute;
    top: 16.8vw;
    width: 11.22vw;
    height: 11.22vw;
    left: 40.2vw;
}
.dots-warp {
    width: 100%;
    margin-top: 3.61vw;
}
.dots-box {
    line-height: 0.96vw;
}
.dots-warp .dots {
    border-radius: 50%;
    background: #999;
    transition: all 0.2s;
    width: 0.8vw;
    height: 0.8vw;
    margin-right: 2.64vw;
    display: inline-block;
}
.dots-warp .dots:last-child {
    margin-right: 0;
}
.dots-warp .dots.dots-active {
    background: #FFFFFF;
    width: 0.96vw;
    height: 0.96vw;
}
.popupStyle {
    display: none;
    background-color: rgb(254, 240, 240);
    color: rgb(247, 88, 88);
    text-align: center;
    border-radius: 0.32vw;
    padding: 0.64vw 0.8vw;
    position: fixed;
    z-index: 1;
    top: 1.6vw;
    left: 36%;
    font-size: 1.28vw;
}
.loading{
    display: none;
    width: 6.41vw;
    height: 3.21vw;
    margin: 0 auto;
    position: absolute;
    top: 20.7vw;
    left: 43.5vw;
    z-index: 1;
}
.loading span{
    display: inline-block;
    width: 0.64vw;
    height: 100%;
    border-radius: 0.32vw;
    background: #ffb400;
    animation: load 1s ease infinite;
    -webkit-animation: load 1s ease infinite;
}
@keyframes load{
    0%,100%{
        height: 40px;
        background: #ffb400;
    }
    50%{
        height: 70px;
        margin: -15px 0;
        background: lightblue;
    }
}
@-webkit-keyframes load{
    0%,100%{
        height: 40px;
        background: #ffb400;
    }
    50%{
        height: 70px;
        margin: -15px 0;
        background: lightblue;
    }
}
.loading span:nth-child(2){
    animation-delay:0.2s;
    -webkit-animation-delay:0.2s;
}
.loading span:nth-child(3){
    animation-delay:0.4s;
    -webkit-animation-delay:0.4s;
}
.loading span:nth-child(4){
    animation-delay:0.6s;
    -webkit-animation-delay:0.6s;
}
.loading span:nth-child(5){
    animation-delay:0.8s;
    -webkit-animation-delay:0.8s;
}
/*
flex：定义布局为盒模型
flex-v：盒模型垂直布局
flex-1：子元素占据剩余的空间
flex-align-center：子元素垂直居中
flex-pack-center：子元素水平居中
flex-pack-justify：子元素两端对
*/
.flex {
    display: -webkit-box; /* 老版本语法: Safari, iOS, Android browser, older WebKit browsers. */
    display: -moz-box; /* 老版本语法: Firefox (buggy) */
    display: -ms-flexbox; /* 混合版本语法: IE 10 */
    display: -webkit-flex; /* 新版本语法: Chrome 21+ */
    display: flex; /* 新版本语法: Opera 12.1, Firefox 22+ */
}
.flex-1 {
    -webkit-flex: 1; /* Chrome */
    -ms-flex: 1; /* IE 10 */
    flex: 1; /* NEW, Spec - Opera 12.1, Firefox 20+ */
    -webkit-box-flex: 1; /* OLD - iOS 6-, Safari 3.1-6 */
    -moz-box-flex: 1; /* OLD - Firefox 19- */
}
.flex-v {
    -webkit-box-orient: vertical;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
}
.flex-align-center {
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
}
.flex-pack-center {
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
}