@media screen and (min-width: 1400px) {
    .layui-container {
        width: 1250px;
    }
}

@media (min-width: 768px) {
    .recharge-panel {
        border-radius: 35px;
    }
    .mobile-hide {
        display: block;
    }
    .mobile-show {
        display: none!important;
    }
    .flow-list {
        .flow-list-show {
            padding: 10px 20px;
            .flow-list-card {
                .flow-list-image {
                    border-radius: 20px;
                    img {
                        border-radius: 10px;
                    }
                }
            }
        }
    }
    .login-form {
        padding: 50px 100px 10px;
    }
    .login-iframe {
        width: 960px;
        height: 540px;
    }
    .search-box {
        width: 50%;
    }
}
@media (max-width: 768px) {
    .recharge-panel {
        border-radius: 15px;
    }
    .mobile-hide {
        display: none;
    }
    .mobile-show {
        display: flex;
    }
    .flow-list {
        .flow-list-show {
            padding: 5px 8px;
            .flow-list-card {
                .flow-list-image {
                    border-radius: 10px;
                    img {
                        border-radius: 10px;
                    }
                }
            }
        }
    }
    .login-form {
        padding: 50px;
    }
    .login-iframe {
        width: 100%;
        height: 320px;
    }
    .search-box {
        width: 100%;
    }
    .container {
        .content-wrap {
            .content {
                margin-right: 0!important;
            }
        }
    }
}

body {
    background-color: rgba(242,247,255,1);
}
.margin-top5 {
    margin-top: 5px;
}
.margin-top10 {
    margin-top: 10px;
}
.margin-top20 {
    margin-top: 20px;
}
.margin-top30 {
    margin-top: 30px;
}
.margin-top50 {
    margin-top: 50px;
}
.margin-h20 {
    margin-top: 20px;
    margin-bottom: 20px;
}
.margin-h10 {
    margin-top: 10px;
    margin-bottom: 10px;
}
.margin-h3 {
    margin: 15px 25px;
}
.margin-w20 {
    margin-right: 20px;
    margin-left: 20px;
}
.margin-w10 {
    margin-right: 10px;
    margin-left: 10px;
}
.padding-w20 {
    padding-right: 20px;
    padding-left: 20px;
}
.padding-w10 {
    padding-right: 10px;
    padding-left: 10px;
}
.height-100vh {
    height: 100vh !important;
}
.fixed-radius-20 {
    border-radius: 20px;
}
.fixed-radius-30 {
    border-radius: 30px;
}
.circle-radius {
    border-radius: 50%;
}
.share-qrcode {
    img {
        margin: 0 auto;
    }
}
.layui-layer-fixed {
    top: 150px!important;
    textarea {
        margin: 10px 15px;
    }
}
.border-right {
    border-right: 1px solid #acacac;
}
.bg-purple {
    background-color: #8e70f5!important;
    color: #ffffff!important;
}
.bg-white {
    background-color: #fff!important;
}
.bg-green {
    background-color: #00ff00!important;
}
.bg-transparent {
    background-color: transparent!important;
}
.text-center {
    text-align: center;
}
.layui-fixbar {
    .layui-fixbar-top {
        border-radius: 15px;
        border: 5px solid rgba(250, 250, 250, 0.6);
        transform: rotate(90deg);
        font-size: 25px;
        color: rgba(250, 250, 250, 0.9);
        &::before {
            font-size: 25px;
            content: "\e65c";
        }
    }
}