#join ul.workul{
    margin: 10px 0 60px 0;
}
#join ul.workul li{
    display: block;
    overflow: hidden;
    margin: 0 0 14px 0;
    padding: 0px;
    background: #f1f1f1;
    height: 106px;
    border: 1px #e0e0e0 solid;

}



#join ul.workul li .text{
    background: url("../images/joinimg1.png") no-repeat 96% center;
    background-size: 32px;
    padding: 10px 30px;
    cursor: pointer;
}

#join ul.workul li .text h3{
    font-size: 22px;
    font-weight: 400;
    color: #202020;
    line-height: 22px;
}
#join ul.workul li .text h3 span{
    font-size: 16px;
    font-weight: 400;
    color: #9A9A9A;
    line-height: 22px;
    letter-spacing: 0;
}
#join ul.workul li .text p span{
    font-size: 16px;
    font-weight: 400;
    color: #202020;
    line-height: 22px;
}
#join ul.workul li .text p span:nth-child(1).icon{
    display: inline-block;
    background:#1e7b45;
    padding: 2px 3px 2px 3px;
    font-size: 13px;
    font-weight: 400;
    color: #ffffff;
    border-radius: 3px;
    line-height: 14px;
}

#join ul.workul li .text p span:nth-child(2) em {
    width: 1px;
    height: 14px;
    display: inline-block;
    background: #797979;
    margin: -2px 4px 0 4px;
    vertical-align: middle;
}

#join ul.workul li .workinfo {
    display: block;
    overflow: hidden;
    background: #ffffff;
    padding:0px 20px  0px 20px;
}
#join ul.workul li .workinfo .dome{
    margin: 30px 0 20px 0;
}

/*#join ul.workul li .workinfo .dome h2{
    display: inline-block;
    background: #e5f1fd;
    border-radius: 20px;
    padding: 8px 22px;
    font-size: 20px;
    font-weight: 400;
    color: #202020;
    line-height: 22px;
    margin: 0 0 14px 0;
}
#join ul.workul li .workinfo .dome p{
    font-size: 14px;
    font-weight: 400;
    color: #343434;
    line-height: 28px;
}*/
#join ul.workul li .workinfo .dome *{
    margin: 0 0 0 0;
    padding: 0 0 0 0;
}



#join ul.workul li.openClass {
    background: #ffffff;
    border: 1px #0f8842 solid;
}

#join ul.workul li.openClass .text p span,
#join ul.workul li.openClass .text h3 span,
#join ul.workul li.openClass  h3 {
    color: #ffffff;
}
#join ul.workul li.openClass .text p span:nth-child(2) em,
#join ul.workul li.openClass .text p span:nth-child(1).icon{
    background: #ffffff !important;
    color: #0f8842;
}

#join ul.workul li.openClass .text{
    background: url("../images/joinimg2.png") no-repeat 96% center #0f8842;
    background-size: 32px;
}



@media screen and (min-width: 800px) {

    #join ul.workul li:hover .text{
        background: url("../images/joinimg2.png") no-repeat 96% center #0f8842;
        background-size: 32px;
    }
    #join ul.workul li:hover .text p span,
    #join ul.workul li:hover .text h3 span,
    #join ul.workul li:hover h3 {
        color: #ffffff;
    }

    #join ul.workul li:hover .text p span:nth-child(2) em{
        background: #ffffff !important;
    }
    #join ul.workul li:hover .text p span:nth-child(1).icon{
        background: #ffffff !important;
        color: #0f8842;
    }

}




@media screen and (max-width: 1450px) {
    #join ul.workul li .text h3 {
        font-size: 22px;
    }
    #join ul.workul li .text h3 span {
        font-size: 15px;
    }
    #join ul.workul li .text p span {
        font-size: 15px;
    }

}



@media screen and (max-width: 1200px) {
    #join .container {
        width: 100%;
    }
}






@media screen and (max-width: 1000px) {
    #join {
        padding: 0 10px;
    }

    #join ul.workul {
        margin:0 0 40px 0;
    }
    #join ul.workul li {
        height: 79px;
    }

    #join ul.workul li .text {
        padding: 8px 12px;
        background: url(../images/joinimg1.png) no-repeat 96% center ;
        background-size: 22px;
    }
    #join ul.workul li .text h3 {
        font-size: 15px;
        line-height: 19px;
        margin: 8px 0 6px 0;
    }
    #join ul.workul li .text h3 span {
        font-size: 12px;
        line-height: 12px;
    }
    #join ul.workul li .text p span:nth-child(1).icon {
        font-size: 12px;
    }
    #join ul.workul li .text p span {
        font-size: 12px;
        line-height: 15px;
    }

    #join ul.workul li.openClass .text{
        background: url("../images/joinimg2.png") no-repeat 96% center #0f8842 ;
        background-size: 22px;
    }
    #join ul.workul li.openClass .workinfo {
        padding: 0px 0px;
    }
    #join ul.workul li .workinfo .dome{
        padding: 0 10px;
        margin: 20px 0 10px 0;
    }
    #join ul.workul li .workinfo .dome *{
        font-size: 12px !important;
        line-height: 18px !important;
    }





}
