
.main-mobile{
    display: none;
}

body.mobile{
    background-image: linear-gradient(135deg, #fdfcfb 0%, #e2d1c3 100%);
}
body.mobile .main-mobile{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: 20px;
    min-height: 100vh;
}
body.mobile .home-left{
    display: none;
}
body.mobile .home-right{
    display: none;
}
body.mobile .mobile-logo a{
    width: 100vw;
    height: 80px;
    display: block;
    margin-bottom: 30px;
    background: url(../img/logo.png) no-repeat center center;
    background-size: contain;
}
body.mobile .main-mobile .course a{
    /*background: url(../img/nav-course.png) no-repeat center top;*/
    display: block;
    width: 118px;
    height: 132px;
    text-indent: -9999px;
}
body.mobile .main-mobile .knowledge a{
    /*background: url(../img/nav-knowledge.png) no-repeat center top;*/
    display: block;
    width: 118px;
    height: 132px;
    text-indent: -9999px;
}

body.mobile header, body.mobile footer{
    display: none;
}

body.mobile *{
    box-sizing: border-box;
}
body.mobile{
    width: 100%;
    min-height: 100%;
}
html{
    min-height: 100%;
}

body.mobile #container{
    width: 100% !important;
    min-height: 100%;
}
body.mobile .tutorial-excerpt{
    width: auto;
}
body.mobile .tutorial-title{
    width: calc(100% - 20px);
    margin-left: 20px;
    margin-top: 25px;
}
body.mobile .tutorial-title .number{
    left: -20px;
}
body.mobile .read-container{
    padding: 15px;
}
body.mobile .tutorials-category{
    display: none;
}
body.mobile .tutorials-container{
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}
body.mobile .knowledge-container{
    width: 100%;
}
body.mobile .tutorial-title ul{
    display: none;
}
body.mobile .tutorial-content{
    width: 100%;
}
body.mobile .tutorial-video{
    width: 100%;
    height: auto;
}
body.mobile .tutorial-video iframe{
    aspect-ratio: 16 / 9;
    width: 100% !important;
    height: auto !important;
}
body.mobile .tutorial-flow{
    display: none;
}
body.mobile .tutorials-container .tutorial-box{
    flex: 1 1 auto;
    text-align: center;
}
body.mobile .knowledge-container .frame-top, body.mobile .knowledge-container .frame-bottom{
    display: none;
}
body.mobile .knowledge-container{
    padding: 20px 10px 40px 10px;
    margin: 0;
    min-height: 100%;
}
body.mobile .frame-container{
    display: flex;
    flex-direction: column;
}
body.mobile .frame-container .question-list{
    overflow: auto !important;
    border: 1px solid #AEAEAE;
    border-radius: 3px;
    display: block;
    padding: 10px;
    background: white;
}
body.mobile .frame-container .question-list li{
    padding: 10px;
    margin: 0;
    line-height: normal;
    a{
        width: 100%;
        display: inline-block;
        font-size: 16px;
    }
}
body.mobile .frame-container .question-list {
    width: 100% !important;
    height: calc(30vh) !important;
}
body.mobile .frame-container .answer-container{
    width: 100% !important;
    height: calc(70vh - 70px) !important;
    border: 1px solid #AEAEAE;
    margin-top: 10px;
    overflow: auto;
    border-radius: 3px;
    display: block;
    padding: 20px;
    background: white;
    box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
    font-size: 16px;
}
body.mobile .frame-container .answer-container .grey{
    display: none;
}
