/*---------コンテンツページごとに変更 sp ---------*/
.foot_contact_wrap{
  padding-top: var(--px90);
}
/*---------中途採用 sp ---------*/
.inner{
  padding: var(--px100) 0 0;
  width: min(90%,1740px);
  margin: 0 auto;
  
  &:last-child{/*--- 船舶乗組員（海外まき網漁船 ----*/
    padding: var(--px60) 0;
  }
  
  .titles{
    color: #fff;
    
    h3{
      font-size: var(--font-size48);
      font-weight: var(--ExtraBold);
      line-height: 1.5;
    }
    h4{
      font-size: var(--font-size18);
      font-weight: var(--Bold);
      line-height: 1.5;
      position: relative;
      padding-bottom: var(--px40);
      
      &:after{
        position: absolute;
        content: '';
        display: inline-block;
        width: 5.5em;
        bottom: 0;
        left: 0;
        border-bottom: solid clamp(1px,0.2vw,2px) #fff;
      }
    }
  }
  .table_title{
    font-size: var(--font-size28);
    font-weight: var(--Bold); 
    color: #fff;
    text-align: center;
    padding: var(--px20) 0;
  }
  .table{
    border-radius: var(--px20);
    margin-top: var(--px40);
    padding: var(--px40) var(--px40) var(--px70);
    backdrop-filter: blur(9px);
    background-color: rgba(255,255,255,.9);
    
    p{
      padding-top: var(--px30);
      font-size: var(--font-size18);
      font-weight: var(--SemiBold);
    }
    
    table{
      width: 100%;
      border-collapse: collapse;
      
      tr{        
        /*ドットを調整*/
        background-image : linear-gradient(to right, #707070 4px, transparent 1px);
        background-size: 6px 1px;
        background-repeat: repeat-x;
        background-position: left bottom;
      }
      
      th{
        font-size: var(--font-size18);
        font-weight: var(--Bold); 
        padding: var(--px20) var(--px20) 0 var(--px20);
        display: block;
        text-align: left;        
      }
      td{
        padding: 0 var(--px20) var(--px20) var(--px20);
        display: block;
        
        a{
          color: var(--main-color);
          text-decoration: underline;
        }
      }
    }

  }
  /*---------募集要項一覧に戻るボタン sp ---------*/
  .recruitment_info{
    width: min(85%,380px);
    margin: var(--px40) auto 0;
    text-align: center;
    font-size: var(--font-size24);
    font-weight: var(--ExtraBold);
    background-color: #F1914A;
    border-radius: var(--px20);
    
    a{
      color: #fff;
      display: block;
      width: 100%;
      padding: var(--px30) var(--px30) var(--px30) 0;
      position: relative;
      
      &:after{
        position: absolute;
        content: "";
        right: 35px;
        bottom: calc(50% - 8px);
        /*ボーダー矢印*/
        display: inline-block;
        width: 15px;
        height: 15px;
        border-top: 4px solid #fff;
        border-right: 4px solid #fff;
        transform: rotate(45deg);
      }
    }
  }
}  
/*---------お問い合わせ先 sp ---------*/
.contact_infomation{
  padding: var(--px85) 0;
  background-color: #fff;
  text-align: center;
  
    h3{
      font-size: var(--font-size60);
      font-weight: var(--ExtraBold);
      position: relative;
      padding-bottom: var(--px50);
      color: var(--main-color);
      line-height:1.2;
      
      &:after{
        position: absolute;
        content: '';
        display: inline-block;
        width: 2.1em;
        bottom: 0;
        left: calc((100% - 2.1em) / 2);
        border-bottom: solid clamp(1px,0.2vw,2px) var(--font-color);
      }
    }
  .infomation_name{
    font-size: var(--font-size24);
    font-weight: var(--Bold);
    padding-top: var(--px60);
    
  }
  .infomation_add{
    font-size: var(--font-size20);
  }
  .infomation_tel{
    font-size: var(--font-size32);
    font-weight: var(--Bold);
    padding-top: var(--px40);
    
    a{
      color: var(--main-color);
    }
    
    span{
      font-size: var(--font-size24);
      
    }
  }
}
/*---------マイナビバナー sp ---------*/
.mynavi{
  padding: var(--px60) 0;
  width: min(95%,1740px);
  margin: 0 auto;
  border-bottom: 1px solid #fff;
  
  .recruitment_info{
    width: min(90%,640px);
    margin: 0 auto;
    text-align: center;
    font-size: var(--font-size24);
    font-weight: var(--ExtraBold);
    background-color: #F1914A;
    border-radius: var(--px20);
    
    a{
      color: #fff;
      display: block;
      width: 100%;
      padding: var(--px60) 0;
      position: relative;
      
      &:after{
        position: absolute;
        content: "";
        right: 35px;
        bottom: calc(50% - 10px);
        /*ボーダー矢印*/
        display: inline-block;
        width: 15px;
        height: 15px;
        border-top: 4px solid #fff;
        border-right: 4px solid #fff;
        transform: rotate(45deg);
      }
    }
  }
  
  .mynavi_btn{
    width: 195px;
    margin: var(--px40) auto 0;
    text-align: center;
    
    a{
      display: block;
      width: 100%;
    }
  }
}
@media (min-width:768px){
/*---------中途採用 tab ---------*/
.inner{
  .table{
    table{  
      th{ 
        padding: var(--px20);
        display: table-cell;
        vertical-align: top;
      }
      td{
        padding: var(--px20);
        display: table-cell;
      }
    }
  }
}
  
  
  
}
@media (min-width:1024px){
/*---------中途採用 pc ---------*/
.inner{
  display: flex;
  justify-content: space-between;
  
  .titles{
    width: 25%;
  }
  .table_wrap{
    width: 75%;
  }
  .table{
    margin-top: 0;
    
    table{  
      th{ 
        padding: var(--px20);
        display: table-cell;
        min-width: 180px;
      }
      td{
        padding: var(--px20);
        display: table-cell;
      }
    }
  }
} 
  
  
}
@media (min-width:1280px){
/*---------中途採用 1280 ---------*/
.inner{
  .table{    
    table{  
      th{ 
        min-width: 250px;
      }
    }
  }
} 

  
}

@media (min-width:1580px){  
/*---------中途採用 pc ---------*/
.inner{
  justify-content: flex-start;
  
  .titles{
    width: 18%;
  }
  .table_wrap{
    width: 64%;
  }
  .table{
    padding: 40px 80px 80px;
    
    table{  
      th{ 
        padding: 20px 30px;
      }
      td{
        padding: 20px 30px;
      }
    }
  }
} 
  
}