@charset "utf-8";

  
    .recruitment_contents_1{
        background: #f5f5f5;
    }
     
    .recruitment_contents_1 .work_list{
        display: flex;
        justify-content: space-between;
        align-items: center;
        flex-wrap: wrap;
    }

    .recruitment_contents_1 .work_list li{
        width: calc((100% - 60px)/3);
        overflow: hidden;
        border-radius: 10px;
    }
    .recruitment_contents_1 .work_list li .work_thumb{
    width: 100%;
    height: 0;
    overflow: hidden;
    padding-bottom: 48%;
    position: relative;
    }
    .recruitment_contents_1 .work_list li .work_thumb img{
      width: 100%;
      height: auto;
      position: absolute;
      left: 0;
      top: -16%;

    }

    .recruitment_contents_1 .work_list li dl dt{
        width: 100%;
        background: var(--navy);
        color: var(--white);
        text-align: center;
        padding: 20px;
        font-size: 23px;
        font-weight: 700;
	    line-height: 1.3;
       letter-spacing: -0.75px; 
    }
    .recruitment_contents_1 .work_list li dl dd{
        padding:30px 15px ;
        text-align: center;
        background: var(--white);
        height: 190px;
        display: flex;
        justify-content: center;
        align-items: center;
       	   line-height: 1.3;
 letter-spacing: -0.75px; 
        color: var(--gray01);
        width: 100%;
        word-break: keep-all;
        font-size: 18px;
        font-weight: 500;
    }
  

    .recruitment_contents_2 .benefits_list{
        display: flex;
        justify-content: center;
        flex-wrap: wrap;
      
        gap: 30px;
    }
    .recruitment_contents_2 .benefits_list li{
        width: calc((100% - 90px)/4);
        overflow: hidden;
        border-radius: 20px;
    }

    .recruitment_contents_2 .benefits_list li .benefits_thumb{
        width: 100%;
    height: 0;
    overflow: hidden;
    padding-bottom: 48%;
    position: relative;
        
    }
    .recruitment_contents_2 .benefits_list li .benefits_thumb img{
      width: 100%;
      height: auto;
      position: absolute;
      left: 0;
      top: 0;
        

    }
    .recruitment_contents_2 .benefits_list li dl dt{
        width: 100%;
        background: var(--navy);
        color: var(--white);
        text-align: center;
        padding: 15px;
        font-size: 23px;
        font-weight: 700;
	    line-height: 1.3;
        letter-spacing: -0.75px; 
    }
    .recruitment_contents_2 .benefits_list li dl dd{
        padding:25px 15px ;
        text-align: center;
        background:#f5f5f5 ;
        height: 120px;
        display: flex;
        justify-content: center;
        align-items: center;
        line-height: 1.7;
        letter-spacing: 0px;
        color: var(--gray01);
        font-weight: 500;
        font-size: 20px;
			   line-height: 1.3;
 letter-spacing: -0.75px; 
    }
    .recruitment_contents_2 .benefits_list li dl dd pre{
        font-size: inherit;
        font-weight: inherit;
        line-height: inherit;
        color:inherit;
        letter-spacing: inherit;
        word-break: keep-all;
		line-height: inherit;
 letter-spacing: inherit; 
    }

    .recruitment_contents_3{
        background: #f5f5f5;
    }

    .recruitment_contents_3 .procedure_list{
        display: flex;
        justify-content: center;
        align-items: center;
        gap: 35px;
        flex-wrap: wrap;
    }
    .recruitment_contents_3 .procedure_list .process {
        width:168px ;
        text-align: center;
        display: flex;
        flex-direction: column;
        gap: 25px;
        justify-content: center;
        align-items: center;
		position:relative;
    }
	.recruitment_contents_3 .procedure_list .process::before{
	   content:'';
	   display:block;
	   background: url(/img/recruit/line.png) no-repeat center /cover;
	   position:absolute;
	   left: -17%;
	   top:40%;
	   width:18px;
	   height:2px;
	       transform: translateY(-50%);
	}
	.recruitment_contents_3 .procedure_list .process:first-child::before{
	  display:none;
	}
    


    .recruitment_contents_3 .procedure_list .process .procedure_thumb{
        width:168px ;
        height: 168px;
        background: var(--white);
        display: flex;
        justify-content: center;
        align-items: center;
        border-radius: 50%;
        position: relative;
       
    }
    .recruitment_contents_3 .procedure_list .process .procedure_thumb .process_num{
        width: 32px;
        height: 32px;
        border-radius: 50%;
        background-color: #171718;
        color: var(--white);
        font-size: 16px;
        font-weight: 700;
        display: flex;
        justify-content: center;
        align-items: center;
        position: absolute;
        left:10px;
        top: 10px;
        

    }
    
    .recruitment_contents_3 .procedure_list .process p{
        font-size: 23px;
        font-weight: 700;
      

    }

    .recruitment_contents_4 .inquiry_list{
        display: flex;
        justify-content: center;
        flex-wrap: wrap;
        gap: 30px;
        
    }
    .recruitment_contents_4 .inquiry_list li{
        width: calc((100% - 30px)/2);
        background: #f5f5f5;
        border-radius: 15px;
        
    }
    .recruitment_contents_4 .inquiry_list li  dl{
        display: flex;
        padding:30px 40px;
        align-items: center;
        flex-wrap: wrap;
    }
    .recruitment_contents_4 .inquiry_list li  dl dt{
        font-size: 23px;
        font-weight: 700;
         position: relative;
		 box-sizing: border-box;
		 width: 180px;
    }
	.recruitment_contents_4 .inquiry_list li  dl dd::before{
	content: '';
	display: block;
	width: 1px;
	height: 24px;
	background:#777777 ;
	position: absolute;
	left: 0;
	top: 50%;
	transform: translateY(-50%);
	}
	.recruitment_contents_4 .inquiry_list li  dl dd{
	 position:relative;
	 
	}
    .recruitment_contents_4 .inquiry_list li  dl dd a{
        font-size: 30px;
        font-weight: var(--fw-700);
       color: var(--navy);
      padding-left:20px; 
	  box-sizing: border-box;
	  

    }
    
  

    
  @media screen and (max-width: 1400px){
  	
	.recruitment_contents_1 .work_list li{
		width: calc((100% - 45px)/3)
	}

	.recruitment_contents_2 .benefits_list{
		gap: 20px;
	}

	.recruitment_contents_2 .benefits_list li{
		width: calc( (100% - 60px) / 4 );
	}

     .recruitment_contents_3 .procedure_list{
	     gap: 30px 0;
	 }
	 .recruitment_contents_3 .procedure_list .process {
		   width:calc(100%/4);
		   gap:10px;
		   
		
		}
		.recruitment_contents_3 .procedure_list .process::before{
		  display:none;
		}
/*    
    .recruitment_contents_3 .procedure_list {
        gap: 30px;
    }
       .recruitment_contents_3 .procedure_list .process{
      width:calc((100% - 60px)/4);
       } 
    
    	 .recruitment_contents_3 .procedure_list .process{
    	  width:130px;
    	}
    	   .recruitment_contents_3 .procedure_list .process .procedure_thumb{
        width:110px ;
        height: 110px;
        background: var(--white);
        
    }
    	.recruitment_contents_3 .procedure_list .process .procedure_thumb img{
    	  transform:scale(0.8);
    	}
    	    .recruitment_contents_3 .procedure_list .process .procedure_thumb .process_num{
        width: 25px;
        height: 25px;
        font-size: 12px;
        left:7px;
        top: 7px;
        
    
    }
     */

	.recruitment_contents_4 .inquiry_list{
		gap: 20px;
	}
    .recruitment_contents_4 .inquiry_list li{
        /* width: 100%; */
		width: calc( (100% - 20px) / 2 );
    } 

	.recruitment_contents_4 .inquiry_list li dl{
		padding: 30px;
	}

	.recruitment_contents_4 .inquiry_list li dl dt{
		font-size: 22px;
		width: 170px;
	}

	.recruitment_contents_4 .inquiry_list li dl dd a{
		font-size: 25px;
		padding-left: 15px;
	}


}  

@media screen and (max-width: 1200px){
.recruitment_contents_1 .work_list li{
width: calc((100% - 40px)/3);
}

	.recruitment_contents_1 .work_list li .work_thumb{
		padding-bottom: 55%;
	}

	.recruitment_contents_1 .work_list li .work_thumb img{
		width: 100%;
		top: 50%; left: 50%;
		transform: translate(-50%,-50%);
	}

    .recruitment_contents_1 .work_list li dl dt {
        font-size: 20px;
		padding: 15px;
    }
    .recruitment_contents_1 .work_list li dl dd {
        font-size: 16px;
			padding: 20px;
			height:160px;
    }
    .recruitment_contents_1 .work_list li dl dd br{
        display: none;
    }
  /*   .recruitment_contents_1 .work_list li{
        width: 100%;
    margin-bottom: 50px;
    } */
    .recruitment_contents_1 .work_list li:last-child{
        margin-bottom: 0;
    }
    .recruitment_contents_2 .benefits_list{
       gap:20px;	
	}
    .recruitment_contents_2 .benefits_list li dl dt{
     
        padding: 15px;
        font-size: 20px;
       
    }
    .recruitment_contents_2 .benefits_list li dl dd{
        padding:15px 10px ;

        font-size: 16px;
    }
		
		.recruitment_contents_3 .procedure_list{
			width: 90%;
			margin: 0 auto;
		}
		
		.recruitment_contents_3 .procedure_list .process .procedure_thumb{
			width: 140px; height: 140px;
		}

		.recruitment_contents_3 .procedure_list .process .procedure_thumb img{
			transform: scale(0.85);
		}

		.recruitment_contents_3 .procedure_list .process p{
			font-size: 20px;
		}

	.recruitment_contents_2 .benefits_list li {
        width: calc((100% - 30px) / 2);
    }


	.recruitment_contents_4 .inquiry_list li{
        width: 100%;
    } 

	.recruitment_contents_4 .inquiry_list li dl{
		padding: 25px 30px;
	}
	
	.recruitment_contents_4 .inquiry_list li dl dt{
		font-size: 20px;
	}


}


@media screen and (max-width: 900px){
	.recruitment_contents_1 .work_list{
		gap: 30px 20px;
		justify-content: center;
	}
	.recruitment_contents_1 .work_list li {
        width: calc((100% - 20px) / 2);
    }

	.recruitment_contents_1 .work_list li dl dd br{
		display: block;
	}

	.recruitment_contents_3 .procedure_list{
		width: 100%;
	}
}


@media screen and (max-width: 768px){
.recruitment_contents_1 .work_list,
.recruitment_contents_2 .benefits_list{
	gap: 10px;
}
.recruitment_contents_1 .work_list li{
	width: calc((100% - 10px) / 2);
}
    .recruitment_contents_1 .work_list li dl dd {
        font-size: 14px;
    }
    .recruitment_contents_2 .benefits_list li{
    }
    .recruitment_contents_3 .procedure_list .process p{
        font-size: 20px;
    }
		.recruitment_contents_3 .procedure_list .process::before{
		display:none;
	}
    .recruitment_contents_4 .inquiry_list li  dl{

        gap: 10px;
        padding:15px 20px;
      
    }
    .recruitment_contents_4 .inquiry_list li dl dt{
        font-size: 16px;
      
        
    }
        .recruitment_contents_1 .work_list li dl dd br{
        display: block;
    }
    .recruitment_contents_4 .inquiry_list li  dl dd a{
        font-size: 20px;
    }

	.recruitment_contents_3 .procedure_list .process .procedure_thumb {
        width: 75px;
        height: 75px;
    }

	.recruitment_contents_3 .procedure_list .process .procedure_thumb img {
        transform: scale(0.5);
    }

	.recruitment_contents_3 .procedure_list .process .procedure_thumb .process_num{
		width: 17px; height: 17px;
		font-size: 10px;
		left: -5px;
		top: 0;
	}
	.recruitment_contents_3 .procedure_list .process p{
		font-size: 14px;
	}

	.recruitment_contents_4 .inquiry_list li dl dt,
	.recruitment_contents_4 .inquiry_list li dl dd{
		width :100%;
	}
}    

@media screen and (max-width: 500px){
    .recruitment_contents_1 .work_list li dl dd br {
        display: none;
    }

	.recruitment_contents_1 .work_list li dl dt,
	.recruitment_contents_2 .benefits_list li dl dt{
        font-size: 16px;
		padding:7px 15px;
    }

		.recruitment_contents_1 .work_list li dl dd {
        font-size: 13px;
		padding:15px;
		height: 150px;
    }

		.recruitment_contents_1 .work_list li:nth-child(3) dl dd {
			height: auto;
			padding-top: 20px;
			padding-bottom: 20px;
		}

	.recruitment_contents_2 .benefits_list li {
        width: calc((100% - 15px) / 2);
    }
       .recruitment_contents_2 .benefits_list li .benefits_thumb{
   
    }

	 .recruitment_contents_2 .benefits_list li dl dd{

        padding: 15px;
        font-size: 14px;
		height:85px;
       
    }
	.recruitment_contents_3 .procedure_list{
		
	}
	.recruitment_contents_3 .procedure_list .process{
	  /* width:calc((100% - 20px)/2); */
	}

	.recruitment_contents_3 .procedure_list .process::before{
	
	  display:none;

	}

	.recruitment_contents_4 .inquiry_list li{
		width:100%;
	}

     .recruitment_contents_4 .inquiry_list li  dl dt{
        font-size: 16px;
		
     
    }
	    .recruitment_contents_4 .inquiry_list li  dl dd a{
        font-size: 18px;
		padding-left: 0;
        padding-top: 10px;
		display: inline-block;
    }

	.recruitment_contents_4 .inquiry_list li dl dd::before{
		width: 100%; height: 1px;
		top: 0; left: 0;
	}
   
    
    

  
} 
@media screen and (max-width: 360px){
.recruitment_contents_3 .procedure_list .process{
 gap:0;
}
.recruitment_contents_3 .procedure_list .process .procedure_thumb {
  transform:scale(0.8);

}
	.recruitment_contents_4 .inquiry_list li  dl{
	  gap:10px;
	}
	.recruitment_contents_4 .inquiry_list li  dl  dt{
	 width:100%;
	}
.recruitment_contents_4 .inquiry_list li  dl dd a::before{
     display:none 
    }

}


#footer{
border-top:1px solid #e1e1e1 ;
}