@charset "utf-8";
/*************************************************************
 *
 * Copyright (c) 2025 ysrock Co., Ltd.	<info@ysrock.co.jp>
 * Copyright (c) 2025 Yasuo Sugano	<sugano@ysrock.co.jp>
 *
 * Version	: 1.0.0
 * Update	  : 2025.06.20
 *
 *************************************************************/

#recruit_staff {
  text-align: center;
}
#recruit_staff > h2 { 
  text-align: left;
}

#recruit_staff > div.hero > img {
  width: 100%;
}

#recruit_staff > div.description > img {
  width: 100%;
}

#recruit_staff > div.title {
  position: relative;
}
#recruit_staff > div.title > div.wrap {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-image: url(imgs/headline.png);
  background-repeat: no-repeat;
  background-size: 100% 100%;
}
#recruit_staff > div.title > div.wrap > h3 {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
}

#recruit_staff > div.tableWrap {
  background-color: #a29b99;
}
#recruit_staff > div.tableWrap > table {
  width: 100%;
  border-collapse: separate;
}
#recruit_staff > div.tableWrap > table > tbody > tr > th {
  background-color: #2e3233;
}
#recruit_staff > div.tableWrap > table > tbody > tr > td {
  background-color: #000;
  text-align: left;
}

#recruit_staff > div.closing > a {
  color: #fff;
  text-decoration: none;
}
@media print, screen and (min-width: 1025px) {
  /* px */

  #recruit_staff {
    width: 1000px;
    margin: 20px auto;
  }
  #recruit_staff > div.hero {
    margin-top: 30px;
  }

  #recruit_staff > div.description {
    margin-top: 50px;
  }

  #recruit_staff > div.point {
    display: flex;
    justify-content: space-between;
    margin-top: 50px;
    padding: 0 50px;
  }

  #recruit_staff > div.title {
    margin-top: 80px;
    padding-top: 10%;
  }
  #recruit_staff > div.title > div.wrap > h3 {
    padding: 0 30px;
    font-size: 24px;
  }

  #recruit_staff > div.tableWrap {
    width: 800px;
    margin: 50px auto 0 auto;
  }
  #recruit_staff > div.tableWrap > table {
    border-spacing: 0 1px;
  }
  #recruit_staff > div.tableWrap > table > tbody > tr > th {
    width: 200px;
  }
  #recruit_staff > div.tableWrap > table > tbody > tr > td {
    padding: 15px;
  }

  #recruit_staff > div.closing {
    margin-top: 50px;
  }
}
@media screen and (min-width: 641px) and (max-width: 1024px){
	/* px/8.5 */

  #recruit_staff {
    width: 95vw;
    margin: 2.3419vw auto;
  }
  #recruit_staff > div.hero {
    margin-top: 3.5128vw;
  }

  #recruit_staff > div.description {
    margin-top: 5.8548vw;
  }

  #recruit_staff > div.point {
    display: flex;
    justify-content: space-between;
    margin-top: 5.8548vw;
    padding: 0 5.8548vw;
  }

  #recruit_staff > div.title {
    margin-top: 9.3676vw;
    padding-top: 10%;
  }
  #recruit_staff > div.title > div.wrap > h3 {
    padding: 0 3.5128vw;
    font-size: 2.8103vw;
  }

  #recruit_staff > div.tableWrap {
    width: 93.6768vw;
    margin: 5.8548vw auto 0 auto;
  }
  #recruit_staff > div.tableWrap > table {
    border-spacing: 0 0.117vw;
  }
  #recruit_staff > div.tableWrap > table > tbody > tr > th {
    width: 23.4192vw;
  }
  #recruit_staff > div.tableWrap > table > tbody > tr > td {
    padding: 1.7564vw;
  }

  #recruit_staff > div.closing {
    margin-top: 5.8548vw;
  }
}
@media screen and (max-width: 640px){
	/* px/4 */

  #recruit_staff {
    width: 95vw;
    margin: 5vw auto;
  }
  #recruit_staff > div.hero {
    margin-top: 7.5vw;
  }

  #recruit_staff > div.description {
    margin-top: 12.5vw;
  }

  #recruit_staff > div.point {
    margin-top: 10vw;
    padding: 0 10vw;
  }
  #recruit_staff > div.point > img {
    margin-top: 5vw;
  }

  #recruit_staff > div.title {
    margin-top: 20vw;
    padding-top: 20%;
  }
  #recruit_staff > div.title > div.wrap > h3 {
    padding: 0 7.5vw;
    font-size: 6vw;
  }

  #recruit_staff > div.tableWrap {
    width: 100%;
    margin: 12.5vw auto 0 auto;
  }
  #recruit_staff > div.tableWrap > table {
    border-spacing: 0 0.25vw;
  }
  #recruit_staff > div.tableWrap > table > tbody > tr > th {
    display: block;
    padding: 3vw 0;
  }
  #recruit_staff > div.tableWrap > table > tbody > tr > td {
    display: block;
    padding: 3.75vw;
  }

  #recruit_staff > div.closing {
    margin-top: 12.5vw;
  }
}