.recruit{padding:60px 0;}
.recruit-box{margin-top:30px;}
.recruit-list{margin-top:40px;}
.recruit-list>ul{display:block;}
.recruit-list>ul>li{display:block; padding:20px 25px; border-radius:5px; transition:.3s; margin-top:20px; background:#fff; border:1px solid #d8d8d8;}
.recruit-list>ul>li>div{position:relative; border-radius:10px; cursor:pointer; transition:.3s;}
.recruit-list>ul>li>div>i{float:right; width:35px; height:35px; line-height:35px; font-size:25px; transition:.3s; overflow:hidden; text-align:center; border-radius:50px;}
.recruit-list>ul>li>div>h3{display:block; font-size:20px; position:relative; z-index:2; transition:.3s;}
.recruit-list>ul>li>div>h3:hover{color:#2b7ffe;}
.recruit-list>ul>li>div>ul{display:block; font-weight:normal; padding:10px 0 4px 0; font-size:14px; color:#686868;}
.recruit-list>ul>li>div>ul:after{display:block; content:''; clear:both;}
.recruit-list>ul>li>div>ul>li{float:left; line-height:.8;}
.recruit-list>ul>li>div>ul>li+li{border-left:1px solid #d8d8d8; padding-left:10px; margin-left:10px;}
.recruit-list>ul>li>aside{position:relative; font-size:14px; max-height:0; padding:0; margin:0; overflow:hidden; transition:.3s;}
.recruit-list>ul>li>aside a{color:#2b7ffe;}
.recruit-list>ul>li>aside a:hover{color:#224eb5;}
.recruit-list>ul>li.on{border-color:#989898; box-shadow:0 0 8px rgba(0,0,0,0.08);}
.recruit-list>ul>li.on>div>i{transform:rotate(180deg); color:#e7053a;}
.recruit-list>ul>li.on>aside{max-height:1000px; padding:20px 0 0; margin:20px 0 0; border-top:1px solid #d8d8d8;}
@media(max-width:1200px){
.recruit{padding:40px 0;}
.recruit-box{margin-top:20px;}
.recruit-list{margin-top:30px;}
.recruit-list>ul>li{padding:15px 20px; border-radius:5px; margin-top:15px;}
.recruit-list>ul>li>div>i{width:28px; height:28px; line-height:28px; font-size:22px;}
.recruit-list>ul>li>div>h3{font-size:18px;}
.recruit-list>ul>li>div>ul{padding:8px 0 4px 0;}
.recruit-list>ul>li.on>aside{ padding:15px 0 0; margin:15px 0 0; }
}
@media(max-width:992px){
.recruit-service>ul>li{width:50%;}
}
@media(max-width:767px){
.recruit{padding:20px 0;}
.recruit-box{margin-top:10px;}
.recruit-list{margin-top:15px;}
.recruit-list>ul>li{padding:8px 12px; margin-top:8px;}
.recruit-list>ul>li.on>aside{ padding:10px 0 0; margin:10px 0 0; }
}