.newgk-coursemsgpage{
        max-width:1200px !important;
}
.htmlcontent{
    display: flex;
    flex-direction: column;
    align-items: center;
}
.htmlcontent #app {
    width: 1200px;
    display: flex;
    justify-content: space-between;
    position: relative;
    
}

.htmlcontent .box {
    width: 280px;
    overflow: hidden;
    background: #f6f6f6;
    box-sizing: border-box;
    padding: 0 15px 25px 15px;
    position: relative;
}

.htmlcontent .box a {
    display: flex;
    flex-direction: column;
    align-items: center;
    color: #535353;
    text-decoration: none;
    
}

.htmlcontent .box a:hover {
    color: #7560f8;
}

.htmlcontent .imgBox {
    width: 280px;
    height: 186.67px;
    overflow: hidden;
}

.htmlcontent .imgBox img {
    width: 100%;
    height: 100%;
    transition: all 0.6s linear;
}

.htmlcontent .source {
    border: 1px solid #535353;
    padding: 6px 20px;
    border-radius: 25px;
    margin: 20px;
}

.htmlcontent .title {
    margin-bottom: 20px;
    font-size: 20px;
}

.htmlcontent .detail {
    font-size: 14px;
    line-height: 160%;
    text-align: justify;
    width: 100%;
}

/*鼠标hover效果*/

.htmlcontent .box::after {
    content: '';
    width: 280px;
    position: absolute;
    background: #7560f8;
    bottom: 0;
    left: 0;
    height: 0px;
    transition: height 0.3s linear;
    /*利用伪类高度，实现动画效果*/
}

/* .htmlcontent .box:hover::after {
    height: 10px;
} */

.htmlcontent .box:hover img {
    transform: scale(1.15);
}

.htmlcontent .box:hover .source {
    background: #7560f8;
    border-color: #7560f8;
    color: #ffffff;
}
.more{
    width: 100%;
    text-align: right;
    padding-right: 20px;
    padding-bottom: 20px;
    color: #535353;
}
.info,.review{
    margin: auto;
    max-width: 1200px;
    padding:20px 0;
}
.reviewC{
    text-indent: 30px;
}
.deletebtn{
    position: absolute;
    /*width: 50px;*/
    /*height: 20px;*/
    border-radius: 10px;
    /*line-height: 20px;*/
    text-align: center;
    right: 0;
    top:0;
    z-index: 9999999;
    padding:3px 10px;
    border:1px solid #535353;
    cursor: pointer;
}
.deletebtn:hover{
    /*color: #e52d67;*/
    background: #7560f8;
    color: white;
    border:none;
}
@media screen and (min-width: 768px){
    #bigimg{
        width: 100%;
        height: 100%;
        position: fixed;
        background: rgba(0,0,0,.3);
        top: 0;
        display: none;
    }
    
    #bigimg img{
        /* width: 1000px; */
        max-height: 600px;
        margin:auto;
        position: fixed;
        left:0;
        right:0;
        top: 80px;
        cursor: pointer;
    }

    #app::after{
        content:'' ;
        width:  580px;
    }
}

@media screen and (max-width: 768px){
    .htmlcontent .htmlcontent{
        width: 100%;
    }
    .htmlcontent #app{
        width: 100%;
        /* padding:0 25px; */
        flex-direction:column;
        align-items:center;
    }
    .htmlcontent .box{
       margin-bottom: 20px;
    }
}

.modtype_housekeeping{
    display: none;
}
.click_like{
    float:right;
    cursor:pointer;
}
.click_like:hover{
    color:#7560f8;
}