img, video {
  max-width: 100%;
  height: auto;
}

/*イントロ部分*/
#RP_intro {
  max-width: 940px;
  margin: 0 auto;
  padding: 20px;
}

#RP_intro img {
  width: 40%;
  height: auto;
}

#RP_intro .RP_introTxt {
  flex: 1;
  text-align: left;
  font-size:90%;
}

/*LINEで応募*/
#RP_LineButton {
  margin-top:1em;
  text-align:left;
}

#RP_LineButton .rounded-shape {
  display: inline-flex; /* インライン要素として扱いつつ、flexで中央揃え */
  align-items: center;
  justify-content: center;
  font-size: 150%;
  background-color: #9dd219;
  border-radius: 1.5em;
  color: white;
  white-space: nowrap;
  line-height: 2; /* 行の高さを調整して余白を抑える */
  padding: 1ex 2em; /* paddingをゼロにして高さで調整 */
  border:3px solid #FFF;

}

/*仕事紹介*/
#RP_work {
  max-width: 100vw;
  margin: 0 auto;
}

#RP_work img {
  height: auto;
  width:100%;
  text-align:left;
}

#RP_work td:first-child div:last-child {
  margin-left:auto;	
}

#RP_work td:last-child {
  margin-right:auto;
}


#RP_work .RP_workTxt {
  max-width: 700px;
  flex: 1;
  padding:0 40px;
  font-size: 115%;
  text-align:left;
}

#RP_work .RP_workTxt  h2 {
  color:#1F98DE;
  font-size:210%;
  text-align:center;
  margin-bottom:0.5em;
}


/*茂呂運送について*/
#RP_about {
  max-width:700px;
  margin: 0 auto;
  text-align: center;	
}

#RP_about div {
  position: relative;
  padding-bottom: 56.25%;
}


/*募集要項*/
#RP_jobDesc {
  max-width:940px;
  margin: 0 auto;
  text-align: left;
  font-size:90%;
}

#RP_jobDesc table {
  vertical-align:middle;
  width: 100%;
  border-collapse: collapse;
}

#RP_jobDesc table  th,  #RP_jobDesc table td {
  border: 1px solid #ccc;
  padding: 1em 1ex;
}

#RP_jobDesc table strong {
	font-size:100%;
}


/*会社概要*/
#RP_moroInfo {
  max-width:940px;
  margin: 0 auto;
  text-align: left;
  font-size:90%;
}

#RP_moroInfo table {
  vertical-align:middle;
  width: 100%;
  border-collapse: collapse;
}

#RP_moroInfo table  th,  #RP_moroInfo table td {
  border-bottom: 1px solid #ccc;
  padding: 1em 1ex;
}

/*フッター*/
footer {
  width:100vw;
  background-color:#e5e8eb;
  text-align:center;
  line-height:2;
  font-size:80%;
}


/*バナー画像*/
.banner-container {
  width: 100%;
  overflow: hidden;
}

.banner-crop {
  position: relative;
  width: 100%;
  height: 200px; /* 表示したい高さに調整 */
  overflow: hidden;
}

.banner-image {
  width: 100%;
  position: absolute;
  top: -50px; /* 上をどれだけ隠すか調整 */
  left: 0;
}

.banner-overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(31, 155, 222, 0.8); /* 半透明の青 */
  display: flex;
  align-items: center;
  justify-content: center;
}

.banner-text {
  color: white;
  font-size: 3.5em;
  font-weight: bold;
  text-align: center;
  padding: 20px;
}


/*バナー画像（大）*/
.banner-crop_big {
  height: 240px; /* 表示したい高さに調整 */
}

.banner-image_big {
  top: -10px; /* 上をどれだけ隠すか調整 */
}

.banner-text_big {
  font-size: 1.5em;
  font-weight: normal;
  margin-bottom:0;
  padding-bottom:0;
}

.banner-overlay_big {
  flex-direction:column;
  
}



/*画像とテキスト横並びコンテナ*/
.RP_ImgTxtRow {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap:20px;
}

.vmiddle {
  align-items:center;
}


/* スマホ対応 */
@media screen and (max-width: 768px) {
  .sixty-percent,
  .fifty-percent,
  .twenty-percent,
  .eighty-percent,
  .half-width {
    width: 100%;
  }

  .rounded-shape {
    height: 40px;
    font-size: 14px;
  }

  .center-vertical {
    height: auto;
    padding: 10px;
  }
}