.join-container{
    width: 100%;
}
    .join-list{
        max-width: 1280px;
        margin: 0 auto;
    }
        .join-list li{
            border-bottom: 2px solid #666666;
            padding: 0 3%;
            padding-bottom: 1.5%;
            margin-bottom: 3%;
            vertical-align: bottom;
            position: relative;
        } 
        .join-list .join-left{
            display: block;
        }
        .join-list .join-left h1,.join-list .join-left h1 a{
            display: block;
            font-size: 22px;
            color: #333;
            font-weight: 400;
            margin-bottom: 1.5%;
        }
        .join-list .join-left p{
            display: inline-block;
            margin-right: 2%;
            font-size: 16px;
            color: #666;
        }
        .join-list li>a{
            display: inline-block;
            font-size: 16px;
            color: #13912c;
            padding: 0.73% 2.3%;
            border: 1px solid #13912c;
            position: absolute;
            right: 3%;
            top: 30%;
            cursor: pointer;
        }
        .join-list li:hover{
            border-bottom: 2px solid #13912c;
        }
        .join-list li:hover>a{
            color: white;
            background: #13912c;
        }
        .join-list li:hover .join-left h1,.join-list li:hover .join-left h1 a{
            color: #13912c;
        }

@media(max-width:760px){
    .join-list li>a{
        position: static;
        margin-top: 5%;
        margin-bottom: 5%;
        font-size: 14px;
        padding: 2.5% 3.5%;
    }
    .join-list .join-left h1, .join-list .join-left h1 a{
        font-size: 20px;
    }
    .join-list .join-left p{
        font-size: 15px;
    }
}