section.recrutement{border-top:2px solid var(--noir);}

main section.recrutement:first-child, main .bloc_contact + section.recrutement{border-top:none;}

section.recrutement .liste_poste{
width:1740px;
max-width:100%;
padding:150px 65px 130px 65px;
margin:0 auto;
}

section.recrutement .liste_poste .li{
border-left:2px solid var(--noir);
border-right:2px solid var(--noir);
}

section.recrutement .liste_poste .li:first-child{border-top:2px solid var(--noir);}

section.recrutement .liste_poste .li .titre{
position:relative;
display:flex;
flex-flow:row wrap;
padding:20px 95px 20px 30px;
border-bottom:2px solid var(--noir);
cursor:pointer;
transition:0.3s ease-in-out;
}

section.recrutement .liste_poste .li .titre .titre2{padding-right:20px;}

section.recrutement .liste_poste .li:hover .titre, section.recrutement .liste_poste .li.open .titre{
background-color:var(--noir);
color:var(--beige);
}

section.recrutement .liste_poste .li .titre .plusmoins{
position:absolute;
right:0;
top:0;
height:100%;
width:70px;
border-left:2px solid var(--noir);
display:flex;
flex-direction:column;
justify-content:center;
align-items:center;
background-color:var(--beige);
color:var(--noir);
}

section.recrutement .liste_poste .li .titre .plusmoins::after{
content:'+';
font-size:28px;
text-align:center;
}

section.recrutement .liste_poste .li.open .titre .plusmoins::after{content:'-';}

section.recrutement .liste_poste .li .txt{
display:none;
border-bottom:2px solid var(--noir);
}

section.recrutement .liste_poste .li .txt .content{
display:flex;
flex-flow:row-reverse;
}

section.recrutement .liste_poste .li .txt.reverse .content{flex-direction:row;}

section.recrutement .liste_poste .li .txt .content > .ckeditor{
width:100%;
padding:80px 80px 80px 30px;
}

section.recrutement .liste_poste .li .txt .content > figure, section.recrutement .liste_poste .li .txt .content > figure + .ckeditor{width:50%;}

section.recrutement .liste_poste .li .txt .content > figure + .ckeditor{border-right:2px solid var(--noir);}

section.recrutement .liste_poste .li .txt.reverse .content > figure + .ckeditor{
border-left:2px solid var(--noir);
border-right:none;
}

section.recrutement .liste_poste .li .txt .content > figure img{
width:100%;
height:100%;
object-fit:cover;
}

section.recrutement .form{
position:relative;
padding:100px 65px;
background-color:var(--noir);
color:var(--beige);
}

section.recrutement .form .form_recrutement > .titre1{
text-align:center;
display:block;
margin-bottom:90px;
}

section.recrutement .form > article{
width:640px;
max-width:100%;
margin:0 auto;
}

section.recrutement .form .form_recrutement form .lab{
position:relative;
display:block;
}

section.recrutement .form .form_recrutement form .lab .ph{
position:absolute;
top:15px;
left:20px;
opacity:0.6;
color:var(--beige);
z-index:1;
cursor:text;
transition:0.3s ease-in-out;
}

section.recrutement .form .form_recrutement form .lab.on .ph{
top:1px;
font-size:14px;
}

section.recrutement .form .form_recrutement form input[type="text"], section.recrutement .form .form_recrutement form textarea, section.recrutement .form .form_recrutement form select{
width:100%;
border:2px solid var(--beige);
color:var(--beige);
padding:20px 20px 10px 20px;
}

section.recrutement .form .form_recrutement form select{
padding-top:10px;
background-color:var(--noir);
border-top:none;
}

section.recrutement .form .form_recrutement form textarea{height:140px;}

section.recrutement .form .form_recrutement form .file{
position:relative;
display:flex;
width:100%;
cursor:pointer;
color:var(--beige);
border:2px solid var(--beige);
}

section.recrutement .form .form_recrutement form .file span{
display:block;
max-width:100%;
text-overflow:ellipsis;
overflow:hidden;
cursor:pointer;
padding:15px 20px;
flex:1;
border-right:2px solid var(--beige);
}

section.recrutement .form .form_recrutement form .file .picto{
padding:10px 11px;
display:flex;
flex-flow:column;
justify-content:center;
}

section.recrutement .form .form_recrutement form .file input[type="file"]{
position:absolute;
top:0;
left:0;
right:0;
bottom:0;
width:100%;
height:100%;
opacity:0;
cursor:pointer;
z-index:50;
margin:0;
padding:0;
}

section.recrutement .form .form_recrutement form label + label input[type="text"], section.recrutement .form .form_recrutement form label + label textarea, section.recrutement .form .form_recrutement form label + .file{border-top:none;}

section.recrutement .form .form_recrutement form .lab.err textarea, section.recrutement .form .form_recrutement form .lab.err input[type="text"], section.recrutement .form .form_recrutement form .file.err, section.recrutement .form .form_recrutement form .lab.err .ph{color:red;}

section.recrutement .form .form_recrutement form .bt_fleche{
width:100%;
font-family:var(--font-bold);
}

section.recrutement .form .form_recrutement form .mentions{
padding:10px 0 25px 0;
opacity:0.6;
font-size:14px;
line-height:18px;
}

section.recrutement .form .form_recrutement form .alerte{
display:none;
color:red;
padding-bottom:25px;
}

section.recrutement .form .form_recrutement form .coords{
width:100%;
text-align:center;
font-family:var(--font-bold);
padding-top:20px;
text-transform:uppercase;
}

section.recrutement .form .fcaptchaform{margin-top:20px;}

section.recrutement .form .merci{
position:absolute;
top:50%;
left:50%;
transform:translate(-50%, -50%);
display:none;
text-align:center;
font-family:var(--font-bold);
}

/********** medias **********/
@media screen and (max-width:1460px){
section.recrutement .liste_poste{padding:100px 40px;}

section.recrutement .form{padding:80px 40px;}
}

@media screen and (max-width:1080px){
section.recrutement .liste_poste{padding:80px 20px;}

section.recrutement .form{padding:60px 20px;}

section.recrutement .form .form_recrutement > .titre1{margin-bottom:60px;}

section.recrutement .liste_poste .li .txt .content > .ckeditor{padding:50px 50px 50px 30px;}
}

@media screen and (max-width:860px){
section.recrutement .liste_poste{padding:60px 20px;}

section.recrutement .liste_poste .li .titre .plusmoins{width:50px;}

section.recrutement .liste_poste .li .titre{
padding:15px 80px 15px 20px;
flex-flow:column;
}

section.recrutement .liste_poste .li .titre .titre2{padding-right:0;}

section.recrutement .liste_poste .li .titre .titre2 + .detail{padding-top:5px;}

section.recrutement .liste_poste .li .txt .content > .ckeditor{padding:40px 40px 40px 20px;}

section.recrutement .form .form_recrutement > .titre1{margin-bottom:40px;}
}

@media screen and (max-width:680px){
section.recrutement .liste_poste .li .txt .content, section.recrutement .liste_poste .li .txt.reverse .content{flex-flow:column-reverse;}

section.recrutement .liste_poste .li .txt .content > figure, section.recrutement .liste_poste .li .txt .content > figure + .ckeditor{width:100%;}

section.recrutement .liste_poste .li .txt .content > figure + .ckeditor, section.recrutement .liste_poste .li .txt.reverse .content > figure + .ckeditor{
border-bottom:2px solid var(--noir);
border-right:none;
border-left:none;
}
}

@media screen and (max-width:480px){
section.recrutement .form .form_recrutement form input[type="text"], section.recrutement .form .form_recrutement form textarea, section.recrutement .form .form_recrutement form select{padding:20px 10px 10px 10px;}

section.recrutement .form .form_recrutement form select, section.recrutement .form .form_recrutement form .file span{padding:10px;}

section.recrutement .form .form_recrutement form .lab .ph{left:10px;}

section.recrutement .form .form_recrutement form .file .picto{padding:8px;}

section.recrutement .form .form_recrutement form .file .picto svg{width:15px;}
}