@charset "UTF-8";
/*
Theme Name: 株式会社坂上建設 RECRUTING SITE
Theme URI: https://www.sakagami-net.co.jp/recruit/
Description: 株式会社坂上建設 RECRUTING SITE
Version: 1.0.0
Creation Date: 2026.1.26
Last Updated: 2026.2.20
*/


/* =====================================
   フォーム全体
===================================== */

.form-row {
  margin-bottom: 4rem;
}

.form-row label {
  display: block;
}

.required {
  background: #ea5541;
  color: #fff;
  font-size: 1.4rem;
  padding: .2rem .8rem;
  margin-left: 1em;
}

/* =====================================
   input / textarea 共通
===================================== */

input,
select,
textarea {
  font-size: 1.6rem;
  width: 100%;
  height: 5rem;
  border: 1px solid #9fa0a0;
  padding: 0 1rem;
}

textarea {
  height: auto;
  padding: 1rem;
}

/* =====================================
   応募種別
===================================== */

select[name="job-type"] {
  width: 20em;
}

/* =====================================
   生年月日
===================================== */

.birth-flex {
  display: flex;
  align-items: center;
  gap: 1rem;
}

.birth-flex input,
.birth-flex select {
  flex: 1;
}

select[name="birth-month"],
select[name="birth-day"] {
  width: 10em;
}

/* =====================================
   郵便番号
===================================== */

.form-row label:has(.zip) {
  display: flex;
  align-items: center;
  gap: 1rem;
}

.zip {
  width: 15em;
}

.address {
}

/* =====================================
   ▼ セレクトカスタム
===================================== */

select {
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;

  padding: 0 5rem 0 1rem;

  background-image:
    linear-gradient(#9fa0a0, #9fa0a0),
    linear-gradient(45deg, transparent 44%, #000 44%, #000 56%, transparent 56%),
    linear-gradient(-45deg, transparent 44%, #000 44%, #000 56%, transparent 56%);

  background-position:
    right 5rem top,
    right 2.6rem center,
    right 2rem center;

  background-size:
    1px 100%,
    7px 7px,
    7px 7px;

  background-repeat: no-repeat;
	cursor: pointer;
}

/* =====================================
   送信ボタン
===================================== */

.form-submit {
  text-align: center;
  margin-top: 4rem;
}

.form-submit input[type="submit"],
.form-submit input[type="button"],
.form-submit button {
background: url("img/more_w.svg") no-repeat right .5em center;
background-color: var(--color-primary-light);
color: #FFF;
font-size: 1.6rem;
letter-spacing: .05em;
white-space: nowrap;
text-align: center;
width: auto;
padding: .8em 2.5em;
display: inline-block;
border-radius: 100vh;
border: solid 1px var(--color-primary-light);
cursor: pointer;
transition: .3s;
}
.form-submit input:hover,
.form-submit button:hover {
background: url("img/more_p.svg") no-repeat right .5em center;
background-color: #FFF;
color: var(--color-primary);
}

.form-submit input[type="button"] {
background: var(--color-primary-light);
margin-right: 1em;
}
.form-submit input[type="button"]:hover {
background: #FFF;
}

/* =====================================
   レスポンシブ調整
===================================== */

@media (max-width: 1023px) {

select {
  background-size:
    1px 100%,
    6px 6px,
    6px 6px;
}


@media (max-width: 540px) {

select {
  background-size:
    1px 100%,
    5px 5px,
    5px 5px;
}
	
.birth-flex {
    flex-wrap: wrap;
    gap: 8px;
}

}