div.course_section.main {
    display: inline-block;
    margin: 0 0 40px 0;
    width: 100%;
}
div.course_section .cs_item.main {
    display: flex;
    flex-direction: column;
    margin: 0 0 25px 0;
    border: 1px solid #d0d0d0;
    padding: 0 0 2rem;
    width: 100%;
    min-height: 27rem;
    position: relative;
}
div.course_section .cs_item.main:nth-of-type(3n){
    margin-right: 0;
}
div.course_section .cs_item .name{
    background: none;
}
.cs_img{
    width: 100%;
}
div.course_section .cs_item .name{
    margin-left: 5px;
    flex-grow: 1;
}
div.course_section .cs_item .left {
    width: 100%;
    float: none;
    text-align: center;
    display: flex;
    justify-content: center;
}
div.course_section .cs_item .left .cs_price{
    width: 45%;
    margin: 0 7px 0 0;
}
div.course_section .cs_item .left .btn{
    width: 45%;
    border-radius: 0;
}

.cs_item__image {
    width: 100%;
    height: 206px;
    display: flex;
    margin-bottom: 25px;
}

.cs_item__image img {
    width: 100%;
    height: auto;
    object-fit: cover;
}

.im_area{
    height: 206px;
    position: relative;
    overflow: hidden;

    margin-bottom: 1rem;
}
.im_area.not-hover:hover:after{
    background: none !important;
    box-shadow: 0 0 0 10000px rgb(255, 255, 255);

}
.im_area.not-video:hover:after{
    display: none;
}
.im_area:hover:after {
    content: "";
    position: absolute;
    left: 44%;
    top: 40%;
    /* color: #FFF; */
    font-size: 2em;
    box-shadow: 0 0 0 10000px rgba(0,0,0,0.3);
    background: url(/local/templates/main/img/play.png);
    width: 60px;
    height: 60px;
    background-color: rgba(0,0,0,0.3);
}
@media screen  and (max-width: 1024px ) {
    .course_section .cs_item.main{
        width: 100%;
    }
    .im_area {
        height: 254px;
        text-align: center;
        background-position: center !important;
    }
    .course_section .cs_item .left .cs_price {
        width: 60%;
        margin: 0;
        display: inline-block;
        margin-bottom: 0.5rem;
    }
    .course_section .cs_item .left .btn {
        width: 60%;
    }
    .cs_img {
        width: auto;
    }
    .course_section .cs_item .name {
        margin-left: 1rem;
        min-height: 2rem;
        /*text-align: center;*/
    }
}


.course_listblock h1{
    display:block;
    margin:0 0 25px 0;
    font-size:48px;
    line-height:50px;
    color:#393939;
    text-transform:none;
}

/* added */

.course_listblock{
    display:block;
    margin:0 0 50px 0;
}

.course_listblock .choose_course{
    width:196px;
    padding:12px 0;
    background:none;
    border:2px solid #393939;
    font-size:15px;
    line-height:17px;
    color:#393939;
    text-decoration:none;
    cursor:pointer;
    text-transform:uppercase;
    text-align:center;
    font-family:'c_bold';
    display:block;
    margin:0 0 40px;
    transition:all linear .2s;
    box-sizing:content-box;
}

.course_listblock .choose_course:hover{
    background:#393939;
    color:#ffffff;
}

.course_listblock .clb_item{
    display:block;
    margin:0 0 25px;
}

.course_listblock .clb_item p{
    display:block;
    font-size:15px;
    line-height:24px;
    color:#393939;
    margin:0 0 15px 0;
}

.course_listblock .clb_item p.ttl{
    margin-bottom:10px;
    text-transform:uppercase;
    font-family:'c_semi';
    font-size:18px;
    line-height:20px;
}

.course_listblock .clb_more{
    display:block;
    margin:40px auto 0;
    width:42px;
    height:41px;
    background:url(../img/clb_more.png) no-repeat center;
    cursor:pointer;
}

.course_select_block{
    display:block;
    padding:35px 0;
    background:#393939;
    margin:0 0 35px 0;
    text-align:right;
}

.course_select_block .sl_ttl{
    display:inline-block;
    vertical-align:middle;
    font-size:16px;
    line-height:18px;
    color:#ffffff;
    text-transform:uppercase;
    margin:0 0 0;
    padding: 11px 0 8px 65px;
    background:url(../img/course_ttl.png) no-repeat center left;
    text-transform:uppercase;
    font-family:'c_bold';
}

.course_select_block .cs_inline{
    display:inline-block;
    vertical-align:middle;
    margin:0 0 0 30px;
    width:320px;
}

.course_select_block .cs_inline .selectIn:after{
    position:absolute;
    content:'';
    top:-2px;
    bottom:0;
    right:51px;
    width:1px;
    background:#393939;
}

.course_select_block .cs_inline .selectIn{
    padding:0 18px 0 16px;
    cursor:pointer;
    border:0;
    background:#ffffff;
    border:2px solid #ffffff;
    border-bottom:0;
    position:relative;
}

.course_select_block .cs_inline .selectText{
    font-size:16px;
    line-height:18px;
    color:#393939;
    padding:11px 33px 13px 0;
    display:block;
    text-align:left;
    background:url(../img/sel_arr.png) no-repeat right center;
    font-family:'c_reg';
}

.course_select_block .cs_inline.opened .selectIn:after{
    display:none;
}

.course_select_block .cs_inline.opened .selectText{
    background:none;
}

.course_select_block .cs_inline.opened .selectIn{
    border-color:#dcdcdc;
}

.select-sub.cs_inline{
    background:#ffffff;
    padding: 0 0;
    border:1px solid #dcdcdc;
    border-top:0;
}

.select-sub.cs_inline ul{
    border:1px solid #dcdcdc;
    background:#ffffff;
    padding: 0 0;
    border-top:0;
}

.select-sub.cs_inline a{
    display:block;
    padding:5px 16px;
    font-size:16px;
    line-height:18px;
    color:#878787;
    text-decoration:none;
    text-align:left;
}

.select-sub.cs_inline a:hover{
    color:#d9195f;
}

.course_select_block .btn{
    display:inline-block;
    vertical-align:middle;
    margin:0 0 0 30px;
    width: 176px;
    padding: 10px 0 12px;
    background: none;
    font-size: 18px;
    line-height: 19px;
    color:#d9195f;
    text-decoration: none;
    cursor: pointer;
    text-align: center;
    border:2px solid #d9195f;
    font-family: 'c_med';
}

.course_select_block .btn:hover{
    color:#393939;
    background:#d9195f;
}

.course_section{
    display:block;
    margin:0 0 40px 0;
}

.course_section .ttl, h2, .main_ttl{
    display:block;
    margin:0 0 25px 0;
    font-size:30px;
    line-height:32px;
    color:#393939;
    font-family:'c_light';
}

.course_section .cs_item{
    display:block;
    padding:20px 15px 30px;
    margin:0 0 20px 0;
    border:1px solid #d0d0d0;
}

.course_section .cs_item .name{
    display:block;
    margin:0 0 30px 0;
    font-size:15px;
    line-height:17px;
    color:#393939;
    font-family:'c_bold';
    text-decoration:none;
    cursor:pointer;
    padding:0 50px 0 0;
    min-height:30px;
    background:url(../img/cs_name.png) no-repeat right 4px;
    text-transform:uppercase;
}

.course_section .cs_item .name:hover{
    color:#05bfb1;
}

.course_section .cs_item .left{
    width:550px;
    float:left;
    margin:0;
}

.course_section.detail .cs_item .left{
    width:540px;
}

.course_section.detail .cs_item .left.scnd{
    float:right;
}

.course_section .cs_item .right{
    width:555px;
    float:right;
    margin:0;
}

.course_section .cs_item .left .cs_value, .course_section .cs_item .left .cs_time, .course_section .cs_item .left .cs_center, .course_section .cs_item .left .cs_direction{
    display:block;
    margin:0 0 20px 0;
}

.course_section .cs_item .left .cs_format{
    display:block;
    margin:0 0 30px 0;
}

.course_section .cs_item .left .cs_name{
    display:block;
    font-size:16px;
    line-height:18px;
    color:#393939;
    margin:0;
    padding:5px 0 0 40px;
    min-height:21px;
}

.course_section .cs_item .left .cs_time .cs_name{
    margin-bottom:15px;
}

.course_section .cs_item .left span{
    display:inline-block;
    vertical-align:baseline;
    font-size:16px;
    line-height:18px;
    color:#393939;
    margin:0 5px 0 0;
    font-family:'c_med';
}

.course_section .cs_item .left .cs_value .cs_name{
    background:url(../img/cs_value.png) no-repeat left center;
}

.course_section .cs_item .left .cs_time .cs_name{
    background:url(../img/cs_time.png) no-repeat left center;
}

.course_section .cs_item .left .cs_format .cs_name{
    background:url(../img/cs_format.png) no-repeat left center;
}

.course_section .cs_item .left .cs_center .cs_name{
    background:url(../img/cs_center.png) no-repeat left center;
}

.course_section .cs_item .left .cs_direction .cs_name{
    background:url(../img/cs_direction.png) no-repeat left center;
}

.course_section .cs_item .left ol{
    margin:0;
}

.course_section.detail .cs_item .left ol, .course_section.detail .cs_item .left ul, .course_section.school .cs_item .left ol, .course_section.school .cs_item .left ul{
    margin-left:40px;
}

.course_section .cs_item .left ol li{
    margin:0 0 10px 17px;
    font-size:16px;
    line-height:18px;
    color:#393939;
    list-style: disc outside;
    display:list-item;
}

.course_section .cs_item .left ul{
    margin:0;
}

.course_section .cs_item .left ul li{
    margin:0 0 10px 0;
    font-size:16px;
    line-height:18px;
    color:#393939;
    display:block;
}


.course_section .cs_item .left .cs_price{
    display:inline-block;
    vertical-align:middle;
    width:190px;
    padding:12px 0 13px;
    background:#05bfb1;
    font-size:18px;
    line-height:20px;
    min-height:20px;
    color:#ffffff;
    text-align:center;
    font-family:'c_semi';
    margin:0 20px 0 0;
}

.course_section.detail .cs_item .left .cs_price{
    background:#2ac1ec;
    margin:0 45px 0 40px;
}

.course_section .cs_item .left .btn{
    display:inline-block;
    vertical-align:middle;
    width:186px;
    padding:12px 0;
    background:none;
    border:2px solid #393939;
    font-size:15px;
    line-height:17px;
    color:#393939;
    text-decoration:none;
    cursor:pointer;
    text-transform:uppercase;
    text-align:center;
    font-family:'c_bold';
    margin:0;
}

.course_section .cs_item .left .btn:hover{
    background:#393939;
    color:#ffffff;
}

.course_section .cs_item .right p{
    display:block;
    font-size:16px;
    line-height:24px;
    color:#393939;
    margin:0 0 15px 0;
}

.course_section .cs_item .right .item_name{
    display:block;
    font-size:16px;
    line-height:18px;
    color:#b2b2b2;
    text-transform:uppercase;
    margin:0 0 10px 0;
    font-family:'c_bold';
}

.course_section .cs_item .sub_txt{
    display:block;
    margin:15px 0 0 0;
    font-size:16px;
    line-height:18px;
    color:#1a1a1a;
    font-family:'c_med';
}

.course_section .cs_item .sub_txt span{
    display:inline-block;
    vertical-align:baseline;
    margin:0 5px 0 0;
    font-size:16px;
    line-height:18px;
    color:#1a1a1a;
    text-transform:uppercase;
}

@media (max-width: 767.98px) {
    div.course_section .cs_item .left {
        flex-direction: column;
        align-items: center;
    }
    div.course_section .cs_item .left .cs_price,
    div.course_section .cs_item .left .btn {
        width: 90%;
        margin: 0 auto;
    }
    div.course_section .cs_item .left .btn {
        margin-top: 10px;
    }
    div.course_section .cs_item .name {
        margin-bottom: 0;
    }
    div.course_section .cs_item.main {
        padding-bottom: 2rem;
    }
    .im_area {
        height: 190px;
    }
}

@media (max-width: 575.98px) {
    div.course_section .cs_item.main {
        max-width: 360px;
        margin-left: auto;
        margin-right: auto;
    }
}