/*  ハッピーターンの背景　上部 */
.back-color-round-top{
  position: relative;
  margin       : 0 auto;
  position     : relative;                           
  width        : 100%;
  height       : 220px;
  background-color: rgb(221, 231, 245);
  border-radius: 50%/100% 100% 0 0;
 
}

/*  ハッピーターンの背景　下部 */
.back-color-round-down{
  position: absolute;
  margin       : 0 auto;  
  position     : relative;    
  width        : 100%;
  height       : 220px;
  background-color: rgb(221, 231, 245);
  border-radius: 50%/0 0 100% 100%;
  
}




.back-color-square-01{
background-color: rgb(221, 231, 245);
margin: 0 auto;

}

.back-color-square-02{
  width: 100%;
  background-color: rgb(255, 255, 255);
  margin: 0 auto;
}

.back-color-square-03{
 position: relative;
 width: 100%;
 background-color: rgb(221, 231, 245);
 margin: 0 auto;

}

/*仕事内容*/
/* 各コンテナの幅 */
.recruit-container{
  width: 85%;
  margin: 0 auto;
}

.recruit-work-bgimg{
 background-image: url(https://dev-main.ask-ibs.jp/themes/custom/IBSCompany/image/page-recruit/page-technical/backimg5.png) ;
 width: 100%;
 
}

/*
.top-title{
  background-color: #f0f0f0; 
  padding: 10px  50px;
  box-sizing: border-box; 
  background-image: url(image/page-office/backimg2.png);
}
*/


.recrut-work-title h2{
  font-size: 60px;
  color: #696f7c;
  font-weight: 650;
  letter-spacing: 3px;
 
}

/* 製造　production */
/*
.kuuhaku-01{
  position: relative;
}
  */

/*
.sub-title-01{
  position: absolute;
  top: 80px;  
  background-color: #f0f0f0; 
  padding: 30px  ;
  box-sizing: border-box; 
}
  */


.recruit-work-field{
  display: flex;
  /*border: 2px solid #333; *//* コンテナのボーダー */
  padding: 10px;
  gap: 10px; /* 要素間のスペース */
}

/* 3カラム */

.recrui-work-boxtitle{
  width: 45%;
  padding: 10px;
  font-size: 35px;
  margin: 0;
}

.box-text{
  width: 55%;
  padding: 10px;

}

.box-contents{
    width: 55%;
  /*background-color: #f0f0f0; */
  /*border: 2px solid #666;*/
  padding: 10px;
  
 
}

/* 画像 */
.box-img{
   width: 45%;
  /*background-color: #f0f0f0; :*/
  /*border: 2px solid #666;*/
  padding: 10px;
  box-sizing: border-box;
  word-break: break-all;
}
.bg-image-01 {
  margin: 10% 1% 10% 1%;
  background-image: url('https://dev-main.ask-ibs.jp/themes/custom/IBSCompany/image/recruit-site/works-seizo.jpg');  /* 背景画像を設定 */
  background-size: cover;                
  width: 100%;                           
  height: 65%; 
   border-radius: 10px; 
  background-position: 35% 10%;    
  background-repeat: no-repeat;                          
}
.bg-image-02 {
  margin: 10% 1% 10% 1%;
  background-image: url('https://dev-main.ask-ibs.jp/themes/custom/IBSCompany/image/page-recruit/page-technical/img_technical_quality.jpg');  /* 背景画像を設定 */
  background-size: cover;                
  width: 100%;                           
  height: 65%;     
  border-radius: 10px; 
  
  background-repeat: no-repeat;            
}
.bg-image-03 {
  margin: 10% 1% 10% 1%;
  background-image: url('https://dev-main.ask-ibs.jp/themes/custom/IBSCompany/image/recruit-site/works-sekkei.jpg');  /* 背景画像を設定 */
  background-size: cover;                
  width: 100%;                           
  height: 65%;
   border-radius: 10px;    
  background-repeat: no-repeat;                          
}
.bg-image-04 {
  margin: 10% 1% 10% 1%;
  background-image: url('https://dev-main.ask-ibs.jp/themes/custom/IBSCompany/image/page-recruit/page-office/img_office_sales.jpg');  /* 背景画像を設定 */
  background-size: cover;                
  width: 100%;                           
  height: 65%;  
  border-radius: 10px;
 background-repeat: no-repeat; 
 background-position: right;            
}
.bg-image-05 {
  margin: 10% 1% 10% 1%;
  background-image: url('https://dev-main.ask-ibs.jp/themes/custom/IBSCompany/image/page-recruit/page-office/img_office_quality.jpg');  /* 背景画像を設定 */
  background-size: cover;                
  width: 100%;                           
  height: 65%; 
  border-radius: 10px;
   background-repeat: no-repeat; 
   background-position: center;                      
}
.bg-image-06 {
  margin: 10% 1% 10% 1%;
  background-image: url('https://dev-main.ask-ibs.jp/themes/custom/IBSCompany/image/page-recruit/page-office/img_office_manager.jpg');  /* 背景画像を設定 */
  background-size: cover;                
  width: 100%;                           
  height: 65%; 
  border-radius: 10px;   
   background-repeat: no-repeat;  
   background-position: center;                  
}




/* フォント */

.box-title{
  font-size: 20px;
  color: #3058a3;
}

/* その他の職種 */
.jimukei{
  margin: 100px 0 100px 0;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 10px;  
  
}

.jimukei-yajirushi{
  display: flex;
  
}

.jimukei-title {
  font-weight: bold;
  color: #21548C;
  line-height: 1.5;
  text-align: left;  
  font-size:35px;
  margin:5% 3% 5% 20% ;
}

.button-box p{
  margin-bottom:0px;

}

.button-box img{
  width: 380px;
  height: 200px;
  border-radius: 20px;            
  object-fit: cover;
  display: inline-block;
}


h5{
  font-size: 40px;
  }

/* エントリー */
.entory{
  background: #0050b8;
  width: 100%;
  height: 500px;
  /*font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;*/
}

h6{
  font-size: 80px;
}


/* 英字とタイトルの重ね */
.kasane-title{
  position: relative;
}
img.eiji-01 {
width: 300px;
 position: absolute;
  top: -10px;
  left: 150px;
}
img.eiji-02 {
width: 250px;
 position: absolute;
  top: 0px;
  left: 280px;
}
img.eiji-03 {
width: 380px;
 position: absolute;
  top: 0px;
  left: 170px;
}
img.eiji-04 {
width: 300px;
 position: absolute;
  top: -10px;
  left: 150px;
}
img.eiji-05 {
width: 380px;
 position: absolute;
  top: 10px;
  left: 230px;
}
img.eiji-06 {
width: 380px;
 position: absolute;
  top: 10px;
  left: 170px;
}




.kaku-title{
  font-size: 55px;
  font-weight: bold;
  line-height: 1.6;
  padding-left: 7%;
   position: absolute;
   letter-spacing: 8px;
   color: #47484b;
  top: -45px;
  left: 60px;
}
/* テキストの長さにより見切れるた調整整 */
.midashi-top1{
   font-weight: bold;
  color: #21548C;
  line-height: 1.5;
  text-align: left;  
  font-size:2.5vw;
  white-space: nowrap; /* テキストを折り返さない */
}
.midashi-top2{
   font-weight: bold;
  color: #21548C;
  line-height: 1.5;
  text-align: left;  
  font-size:2vw;
  white-space: nowrap; /* テキストを折り返さない */
}
.midashi-top3{
   font-weight: bold;
  color: #21548C;
  line-height: 1.5;
  text-align: left;  
  font-size:2.2vw;
  white-space: nowrap; /* テキストを折り返さない */
}
.midashi {
  font-weight: bold;
  color: #21548C;
  line-height: 1.5;
  text-align: left;  
font-size:35px;
 white-space: nowrap; /* テキストを折り返さない */
 font-size: 2.5vw; /* ビューポート幅の2%のフォントサイズ */


/* 見出しデザイン */
display: flex;
align-items: center;
font-size: 26px;
}
.midashi::before{
content: '';
	width: 20px;
  border-radius: 6px;
	height: 3px;
	background-color:  #21548C;
  margin-right: 20px;
}


.contents-text{
  padding: 5px 15px 50px 15px;
}

.contents-box{
    width: 90%;
    max-width: 1400px;
    margin: 0 auto;
    padding: 100px 0;
}

.contents-box-bg{
    background-color:rgb(221, 231, 245);
}






/*.back-color-round-top{

  margin       : 0 auto;
  position     : relative;                           
  width        : 100%;
  height       : 220px;
 background-color: rgb(221, 231, 245);
  border-radius: 50%/100% 100% 0 0;
  
}*/

.back-color-round-down{
  position: absolute;
  margin       : 0 auto;  
  position     : relative;    
  width        : 100%;
  height       : 220px;
 background-color: rgb(221, 231, 245);
  border-radius: 50%/0 0 100% 100%;
  
}

/* 各コンテナの幅 */

.coontainer{
  width: 75%;
  margin: 0 auto;

}

.kaasane-title{
  position: relative;
  width: 50%;
}
.hatarakukannkyou{
  font-size: 60px;
  color: #696f7c;
  font-weight: 650;
  letter-spacing: 3px;
  position: absolute;  
   top: 30%;
 left:30 %;
}

img.eiji-07 {
width: 400px;
 position: absolute;
  top: 70%;
 left:25%;
}
/* カラム */
.karibako{
 top: -500px;
 margin-top: 150px;
}
.fiield{
  display: flex;
padding: 10px;
gap: 10px 10px 20px 10px;


}
.box-semititle{
  width: 85%;
}
.box-title{
  width: 45%;
  padding: 10px;
  font-size: 35px;
  margin: 0;
}

.box-text{
  width: 55%;
  padding: 10px;

}
.box-contents{
    width: 55%;
  /*background-color: #f0f0f0; */
  /*border: 2px solid #666;*/
  padding: 10px;
  
 
}
.box-semititle{
  width: 85%;
}
.miidashi-01{
   font-weight: bold;
  color: #21548C;

  text-align: left;  
  font-size:40px;
}
.miidashi-02{
  font-weight: bold;

  color: #474747;
  text-align: left;  

 font-size: 20px; /* ビューポート幅の2%のフォントサイズ */
}
.miidashi-03 {
    position: relative;
    display: block;
     font-weight: 600;
     color: #21548C;
     font-size: 30px;
   padding-left: 45px;
}

.miidashi-03::before {
    position: absolute;
    top: 0.5em;
    left: 0;
    display: block;
    width: 0.5em;
    height: 0.5em;
    border-radius: 50%;
    background:#21548C;
    content: "";
    margin-left: 15px;
  
}

.box-icon{
  width: 15%; 
 position: relative;
}
.mini-icon{
 position: absolute;
  top: 7%;
  left: 50%;
  -webkit-transform : translate(-50%,-50%);
  transform : translate(-50%,-50%);
 
  text-align: center;/*一応BOX内の文字も中央寄せ*/
}
.boox-contents{
    width: 100%;
  background-color: rgb(255, 255, 255);
    margin-top: -5px;
    border-radius: 10px;
}
.kaaku-contents{
  width:100%;
  display: flex;
  margin-top: 20px;
}
.coontents-text{
  margin-top: -5px;
  width: 90%;
  padding-bottom: 20px;
}
.coontents-item{
  width: 50%;
  top: 10px;
  margin:25px;
}
/* エントリー */
.entory{
  background: #0050b8;
  width: 100%;
  height: 500px;
  /*font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;*/
}


.kaaku-title{
  font-size: 55px;
  font-weight: bold;
  line-height: 1.6;
  padding-left: 7%;
   position: absolute;
  top: -45px;
  left: 60px;
}
.kaaku-contents{
  margin-bottom: 20px;
}
.midashi-top{
   font-weight: bold;
  color: #21548C;
  line-height: 1.5;
  text-align: left;  
  font-size:28px;
  white-space: nowrap; /* テキストを折り返さない */
 font-size: 2.5vw; /* ビューポート幅の2%のフォントサイズ */
}

.coontents-text{
  padding: 5px ;
  color: #474747;
margin-left: 20px;
}

.coontents-box{
    width: 90%;
    max-width: 1400px;
    margin: 0 auto;
    padding: 50px 0;
}

.cooontents-box{
    width: 90%;
    max-width: 1400px;
    margin: 0 auto;
    padding: 20px 0;
}

.coontents-box-bg{
background-color: rgb(221, 231, 245);

}