@charset "UTF-8";

/* 採用情報アーカイブ：施工事例アーカイブ（works）と同一グリッド。職種は .works__list-tag（角丸なし） */

@media screen and (min-width: 768px), print {


#contentsmain {margin: 80px auto 73px auto;position: relative;background: url('../images/recruit/contentsmain-back01.png')repeat-x top center;animation:bgScroll 70s linear infinite;padding: 280px 0 0;}
@keyframes bgScroll{
0%{background-position:0 0px;}
100%{background-position:-3280px 0px;}
}

#contentsmain .tll-Box {margin: 0 auto 230px;position: relative;width: 1200px;}
#contentsmain .tll-Box h2 {  }
#contentsmain .tll-Box h2::before{content: "";display: block;height: 120px;width: 1px;background: #222;position: absolute;bottom: -201px;left: 50%;}
#contentsmain .tll-Box h2 img {  }
#contentsmain .inner-Box {margin: 0 auto;position: relative;text-align: center;}
#contentsmain .inner-Box h3 {margin-bottom: 30px;position: relative;font-size: 32px;line-height: 1.5;letter-spacing: 0.05em;font-weight: 700;text-align: center;}
#contentsmain .inner-Box h3 span {background: linear-gradient(transparent 60%, #FED700 60%);}
#contentsmain .inner-Box p.text {position: relative;font-size: 16px;line-height: 1.9;letter-spacing: 0.05em;font-weight: 400;text-align: center;}

#contents01 {margin: 0 auto;position: relative;background: url('../images/recruit/contents01-back01.png')no-repeat top center;color: #fff;text-align: center;padding: 73px 0 76px;}
#contents01 .inner-Box { margin: 0 auto; position: relative; }
#contents01 .inner-Box h2 {margin-bottom: 26px;}
#contents01 .inner-Box h2 span{  }
#contents01 .inner-Box h2 img {  }
#contents01 .inner-Box p.text {margin-bottom: 30px;position: relative;font-size: 16px;line-height: 2.5;letter-spacing: 0.05em;font-weight: 400;text-align: center;}

.backk{background: #F3F1EF;padding: 138px 80px 120px;}

#contents02 {margin: 0 auto 51px;position: relative;max-width: 1920px;}
#contents02 .inner-Box { margin: 0 auto; position: relative; }
#contents02 .inner-Box h2 {margin-bottom: 13px;position: relative;font-size: 32px;line-height: 1.5;letter-spacing: 0.05em;font-weight: 700;text-align: center;}
#contents02 .inner-Box p.subttl {margin-bottom: 84px;position: relative;font-size: 24px;line-height: 1.3;letter-spacing: 0.05em;font-weight: 400;text-align: center;}
#contents02 .inner-Box p.subttl span {display: inline-block;text-decoration: underline;}
#contents02 .inner-Box ul{display:flex;flex-wrap:wrap;gap:2.27%;}
#contents02 .inner-Box ul li{width:48.86%;position:relative;margin-bottom: 30px;}
#contents02 .inner-Box span.ch {display: block;line-height: 1;position: absolute;top: -29px;left: 42px;z-index: 3;}
#contents02 .inner-Box span.ch img {  }
#contents02 .inner-Box figure.photo {position: relative;top: 0;left: 0;margin-bottom: -47px;}
#contents02 .inner-Box figure.photo img{width: 100%;height: auto;}
#contents02 .inner-Box h3 {margin-bottom: 15px;position: relative;font-size: 32px;line-height: 0.9;letter-spacing: 0.05em;font-weight: 700;text-align: left;color: #fff;margin-left: 4.9%;}
#contents02 .inner-Box h3 span {display: inline-block;background: #72B862;padding: 17px;}
#contents02 .inner-Box p.text {margin: 0 4.9% 30px;position: relative;font-size: 16px;line-height: 1.9;letter-spacing: 0.05em;font-weight: 400;text-align: left;}

#contents03 {margin: 0 auto;position: relative;background: #FFFFFF;max-width: 1440px;padding-top: 112px;padding-bottom: 125px;}
#contents03 .inner-Box {margin: 0 auto;position: relative;width: 1040px;}
#contents03 .inner-Box h2 {margin-bottom: 11px;position: relative;font-size: 32px;line-height: 1.5;letter-spacing: 0.05em;font-weight: 700;text-align: center;}
#contents03 .inner-Box p.subttl {margin-bottom: 36px;position: relative;font-size: 24px;line-height: 1.3;letter-spacing: 0.05em;font-weight: 400;text-align: center;}
#contents03 .inner-Box ul{display: -webkit-box; display: -moz-flex; display: -ms-flex; display: -o-flex; display: -ms-flexbox; display: flex; -webkit-box-lines: multiple; -moz-box-lines: multiple; -ms-flex-wrap: wrap; flex-wrap: wrap;}
#contents03 .inner-Box ul li {position: relative;width: 480px;}
#contents03 .inner-Box ul li:nth-child(2) {margin-right: 0px;right: -81px;}
#contents03 .inner-Box figure.photo {position: relative;top: 0;left: 0;margin-bottom: 10px;}
#contents03 .inner-Box figure.photo img{  }
#contents03 .inner-Box h3 {margin-bottom: 30px;position: relative;font-size: 20px;line-height: 1;letter-spacing: 0.05em;font-weight: 500;text-align: left;}
#contents03 .inner-Box h3 span {display: block;font-size: 14px;line-height: 2.1;letter-spacing: 0.05em;font-weight: 400;text-align: left;margin-bottom: -3px;}
#contents03 .inner-Box p.ltext {margin-bottom: 30px;position: relative;font-size: 16px;line-height: 1.9;letter-spacing: 0.05em;font-weight: 400;text-align: left;}
#contents03 .inner-Box p.btn {text-align: center; cursor: pointer;}
#contents03 .inner-Box p.btn img {  }
.popup-Box {width: 560px;background: url(../images/recruit/close.svg)no-repeat top 20px right 20px #fff;margin: 0 auto;position: relative;padding: 64px 44px;}
.popup-Box h3 {margin-bottom: 30px;position: relative;font-size: 20px;line-height: 1;letter-spacing: 0.05em;font-weight: 500;text-align: left;}
.popup-Box h3 span {display: block;font-size: 14px;line-height: 2.1;letter-spacing: 0.05em;font-weight: 400;text-align: left;margin-bottom: -3px;}
.popup-Box p.text {font-size: 16px;line-height: 1.9;letter-spacing: 0.05em;font-weight: 400;text-align: left; margin-bottom: 30px; position: relative; }
button.mfp-close{right: 18px;top: 19px;opacity: 0!important;}
#contents04 {margin: 0 auto;position: relative;width: 1160px;text-align: center;padding: 210px 0 90px;}
#contents04 .inner-Box { margin: 0 auto; position: relative; }
#contents04 .inner-Box figure.img01 {position: absolute;top: -153px;left: -20px;}
#contents04 .inner-Box figure.img01 img{  }
#contents04 .inner-Box h2 {margin-bottom: 15px;position: relative;font-size: 40px;line-height: 1.5;letter-spacing: 0.05em;font-weight: 700;text-align: center;}
#contents04 .inner-Box p.text {margin-bottom: 50px;position: relative;font-size: 24px;line-height: 2.1;letter-spacing: 0.05em;font-weight: 400;text-align: center;}
#contents04 .inner-Box figure.photo {position: relative;top: 0;left: 0;margin-bottom: 51px;}
#contents04 .inner-Box figure.photo img{  }
#contents04 .inner-Box h3 {margin-bottom: 0px;position: relative;font-size: 24px;line-height: 2.1;letter-spacing: 0.05em;font-weight: 700;text-align: center;}
#contents04 .inner-Box figure.img02 {position: absolute;bottom: -193px;right: 146px;}
#contents04 .inner-Box figure.img02 img{  }


  #recruit .works .works__inner {
    width: min(95%, 1760px);
    margin-inline: auto;
    padding-top: 50px;
  }

  #recruit .works .works__list {
    max-width: 1400px;
    margin-inline: auto;
    margin-top: 12px;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    align-items: start;
    column-gap: clamp(16px, 0px + 2.083vw, 40px);
    row-gap: 40px;
    padding: 48px 24px;
    background-color: #f2f2f2;
  }

  #recruit .works .works__list-item {
    min-width: 0;
    background-color: #fff;
  }
  #recruit .works .works__list-meta {
    padding-inline: 8px;
    padding-block: 16px;
  }

  #recruit .works .works__list-link {
    display: block;
    color: inherit;
    text-decoration: none;
  }

  #recruit .works .works__list-item--empty {
    grid-column: 1 / -1;
  }

  #recruit .works .works__list-item--empty .works__list-title {
    text-align: center;
  }

  #recruit .works .works__list-img {
    display: block;
    width: 100%;
    height: auto;
  }

  #recruit .works .works__list-img img {
    display: block;
    width: 100%;
    height: auto;
    vertical-align: middle;
  }

  #recruit .works .works__list .works__list-meta .works__list-tags {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    align-content: flex-start;
    column-gap: clamp(8px, 2.67px + 0.694vw, 16px);
    row-gap: 6px;
    margin: 0;
  }

  #recruit .works .works__list .works__list-tag {
    display: inline-block;
    flex-shrink: 0;
    box-sizing: border-box;
    margin: 0;
    padding-block: 4px;
    padding-inline: 16px;
    font-size: clamp(10px, 6px + 0.521vw, 16px);
    font-weight: 400;
    line-height: 1;
    letter-spacing: 0.05em;
    color: #222;
    border: 1px solid #222;
    border-radius: 0;
    text-align: left;
  }

  #recruit .works .works__list-meta .works__list-title {
    margin-top: clamp(4px, -4px + 1.042vw, 16px);
    font-size: clamp(16px, 13.33px + 0.347vw, 20px);
    font-weight: 500;
    line-height: 1.5;
    letter-spacing: 0.05em;
    color: #222;
  }

  #recruit main .works--archive .works-archive-pagenavi {
    margin-top: 56px;
    text-align: center;
  }
}

@media screen and (max-width: 767px) {
  #recruit .works .works__inner {
    padding-top: 14.01vw;
  }

  #recruit .works .works__list {
    display: grid;
    grid-template-columns: 1fr;
    align-items: start;
    row-gap: 7.25vw;
    margin-top: 7.25vw;
    padding-inline: 3.86vw;
  }

  #recruit .works .works__list-item {
    min-width: 0;
  }

  #recruit .works .works__list-link {
    display: block;
    color: inherit;
    text-decoration: none;
  }

  #recruit .works .works__list-item--empty .works__list-title {
    text-align: center;
  }

  #recruit .works .works__list-img {
    display: block;
    width: 100%;
    aspect-ratio: 340/200;
    overflow: hidden;
  }

  #recruit .works .works__list-img img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
  }

  #recruit .works .works__list .works__list-meta .works__list-tags {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    align-content: flex-start;
    column-gap: 1.93vw;
    row-gap: 1.45vw;
    margin: 0;
    margin-top: 4.83vw;
  }

  #recruit .works .works__list .works__list-tag {
    display: inline-block;
    flex-shrink: 0;
    box-sizing: border-box;
    margin: 0;
    padding-block: 1.93vw;
    padding-inline: 4.83vw;
    font-size: 3.14vw;
    font-weight: 400;
    line-height: 1;
    letter-spacing: 0.05em;
    color: #222;
    border: 1px solid #222;
    border-radius: 0;
    text-align: left;
  }

  #recruit .works .works__list-meta .works__list-title {
    margin-top: 3.38vw;
    font-size: 4.35vw;
    font-weight: 500;
    line-height: 1.66666;
    letter-spacing: 0.05em;
    color: #222;
  }

  #recruit main .works--archive .works-archive-pagenavi {
    margin-top: 12vw;
    text-align: center;
  }
}

/* single-recruit：2カラム＋仕様テーブル */
@media screen and (min-width: 768px), print {
  #recruit .recruit-single.system-contents {
    background: #fff;
    padding: 40px clamp(20px, 3vw, 48px);
    margin-top: 80px;
    margin-bottom: 30px;
    border: 1px solid #ccc;
    box-sizing: border-box;
  }

  #recruit .recruit-single__hero {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    column-gap: clamp(24px, 3vw, 48px);
    align-items: start;
  }

  #recruit .recruit-single__col--main {
    min-width: 0;
  }

  #recruit .recruit-single__job {
    display: inline-block;
    margin: 0 0 clamp(16px, 2vw, 24px);
    padding: clamp(10px, 1.2vw, 14px) clamp(20px, 2.5vw, 32px);
    font-size: clamp(14px, 1.1vw, 16px);
    font-weight: 700;
    line-height: 1;
    letter-spacing: 0.05em;
    color: #222;
    text-align: center;
    border: 1px solid #222;
    border-radius: 0;
    box-sizing: border-box;
    max-width: 100%;
  }

  #recruit .recruit-single__title {
    margin: 0 0 clamp(20px, 2.5vw, 32px);
    font-size: clamp(22px, 2vw, 32px);
    font-weight: 700;
    line-height: 1.4;
    letter-spacing: 0.03em;
    color: #222;
  }

  #recruit .recruit-single__col--pic {
    min-width: 0;
  }

  #recruit .recruit-single__pic {
    margin: 0;
    text-align: center;
  }

  #recruit .recruit-single__pic img {
    display: block;
    width: 100%;
    height: auto;
    vertical-align: middle;
  }

  #recruit .recruit-spec-wrap {
    margin-top: clamp(40px, 5vw, 64px);
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }

  #recruit .recruit-spec-table {
    width: 100%;
    max-width: 100%;
    border-collapse: collapse;
    border: 1px solid #ccc;
    font-size: clamp(14px, 1.05vw, 16px);
    line-height: 1.65;
    letter-spacing: 0.03em;
    color: #222;
    table-layout: fixed;
  }

  #recruit .recruit-spec-table__label {
    width: 18%;
    padding: clamp(14px, 1.5vw, 20px) clamp(16px, 2vw, 24px);
    font-weight: 600;
    text-align: left;
    vertical-align: top;
    background: #e8e8e8;
    border: 1px solid #ccc;
    box-sizing: border-box;
  }

  #recruit .recruit-spec-table__value {
    width: 72%;
    padding: clamp(14px, 1.5vw, 20px) clamp(16px, 2vw, 24px);
    text-align: left;
    vertical-align: top;
    background: #fff;
    border: 1px solid #ccc;
    box-sizing: border-box;
  }
}

@media screen and (max-width: 767px) {


@keyframes bgScroll{
0%{background-position:0 0;}
100%{background-position:-792.27vw 0;}
}

#contentsmain {margin: 9.72vw auto 13.53vw auto;position: relative;background: url('../images/recruit/contentsmain-back01.png')repeat-x top center;animation: bgScroll 170s linear infinite;padding: 27.13vw 0 0;background-size:  auto 52.2vw;}
#contentsmain .tll-Box {margin: 0 auto 31.46vw;position: relative;}
#contentsmain .tll-Box h2 {margin: 0 17.2vw 0 2.7vw;}
#contentsmain .tll-Box h2::before{content: "";display: block;height: 14.49vw;width: 0.24vw;background: #222;position: absolute;bottom: -24vw;left: 50%;}
#contentsmain .tll-Box h2 img {  }
#contentsmain .inner-Box {margin: 0 4vw;position: relative;text-align: center;}
#contentsmain .inner-Box h3 {margin-bottom: 2.25vw;position: relative;font-size: 5.8vw;line-height: 1.6;letter-spacing: 0.05em;font-weight: 700;text-align: center;}
#contentsmain .inner-Box h3 span {background: linear-gradient(transparent 60%, #FED700 60%);}
#contentsmain .inner-Box p.text {position: relative;font-size: 3.86vw;line-height: 1.9;letter-spacing: 0.05em;font-weight: 400;text-align: center;}

#contents01 {position: relative;background: url('../images/recruit/sp-contents01-back01.png')no-repeat top center;color: #fff;text-align: center;padding: 10.23vw 0 9.96vw;background-size: 100% auto;}
#contents01 .inner-Box { margin: 0 4vw; position: relative; }
#contents01 .inner-Box h2 {margin: 0 21.2vw 2.58vw 22.7vw;}
#contents01 .inner-Box h2 span{  }
#contents01 .inner-Box h2 img {  }
#contents01 .inner-Box p.text {margin-bottom: 7.25vw;position: relative;font-size: 3.86vw;line-height: 2.5;letter-spacing: 0.05em;font-weight: 400;text-align: center;}

.backk{background: #F3F1EF;padding: 24.03vw 4.22vw 18.99vw;}

#contents02 {margin: 0 auto 3.32vw;position: relative;}
#contents02 .inner-Box {position: relative;}
#contents02 .inner-Box h2 {margin-bottom: 3.14vw;position: relative;font-size: 5.8vw;line-height: 1.6;letter-spacing: 0.05em;font-weight: 700;text-align: center;}
#contents02 .inner-Box p.subttl {margin-bottom: 13.29vw;position: relative;font-size: 4.3vw;line-height: 1.7;letter-spacing: 0.05em;font-weight: 400;text-align: center;}
#contents02 .inner-Box p.subttl span {display: inline-block;text-decoration: underline;}
#contents02 .inner-Box ul{display:flex;flex-wrap:wrap;gap:2.27%;}
#contents02 .inner-Box ul li{position:relative;margin-bottom: 5.25vw;}
#contents02 .inner-Box span.ch {display: block;line-height: 1;position: absolute;top: -4.7vw;left: 4.04vw;z-index: 3;width: 13.5vw;}
#contents02 .inner-Box span.ch img {width: 100%;}
#contents02 .inner-Box figure.photo {position: relative;top: 0;left: 0;margin-bottom: -4.6vw;}
#contents02 .inner-Box figure.photo img{width: 100%;height: auto;}
#contents02 .inner-Box h3 {margin-bottom: 3.62vw;position: relative;color: #fff;margin-left: 4vw;font-size: 5.8vw;line-height: 1.3;letter-spacing: 0.05em;font-weight: 700;text-align: left;}
#contents02 .inner-Box h3 span {display: inline-block;background: #72B862;padding: 0.81vw 3.41vw;}
#contents02 .inner-Box p.text {margin: 0 3.9vw 7.25vw;position: relative;font-size: 3.4vw;line-height: 2.0;letter-spacing: 0.05em;font-weight: 400;text-align: left;}

#contents03 {position: relative;background: #FFFFFF;padding-top: 13.15vw;padding-bottom: 6.19vw;margin: 0 -1.3vw;}
#contents03 .inner-Box {margin: 0 5.3vw;position: relative;}
#contents03 .inner-Box h2 {margin-bottom: 2.66vw;position: relative;font-size: 5.8vw;line-height: 1.6;letter-spacing: 0.05em;font-weight: 700;text-align: center;}
#contents03 .inner-Box p.subttl {margin-bottom: 7.9vw;position: relative;font-size: 4.3vw;line-height: 1.7;letter-spacing: 0.05em;font-weight: 400;text-align: center;}
#contents03 .inner-Box ul{display: -webkit-box; display: -moz-flex; display: -ms-flex; display: -o-flex; display: -ms-flexbox; display: flex; -webkit-box-lines: multiple; -moz-box-lines: multiple; -ms-flex-wrap: wrap; flex-wrap: wrap;}
#contents03 .inner-Box ul li {position: relative;margin-bottom: 9.8vw;}
#contents03 .inner-Box ul li:nth-child(2) {margin-right: 0.0vw;right: 0vw;}
#contents03 .inner-Box figure.photo {position: relative;top: 0;left: 0;margin-bottom: 1.52vw;}
#contents03 .inner-Box figure.photo img{  }
#contents03 .inner-Box h3 {margin-bottom: 7.25vw;position: relative;font-size: 4.83vw;line-height: 1;letter-spacing: 0.05em;font-weight: 500;text-align: left;}
#contents03 .inner-Box h3 span {display: block;font-size: 3.38vw;line-height: 2.1;letter-spacing: 0.05em;font-weight: 400;text-align: left;margin-bottom: 0vw;}
#contents03 .inner-Box p.ltext {margin-bottom: 3.65vw;position: relative;font-size: 3.4vw;line-height: 2.0;letter-spacing: 0.05em;font-weight: 400;text-align: left;}
#contents03 .inner-Box p.btn {text-align: center;cursor: pointer;margin: 0 3.1vw;}
#contents03 .inner-Box p.btn img {  }
.popup-Box {background: url(../images/recruit/close.svg)no-repeat top 4.83vw right 4.83vw #fff;margin: 0 4vw;position: relative;padding: 14.46vw 5.63vw 1vw;background-size: 10vw;}
.popup-Box h3 {margin-bottom: 4.25vw;position: relative;font-size: 4.83vw;line-height: 1;letter-spacing: 0.05em;font-weight: 500;text-align: left;}
.popup-Box h3 span {display: block;font-size: 3.38vw;line-height: 2.1;letter-spacing: 0.05em;font-weight: 400;text-align: left;margin-bottom: 0vw;}
.popup-Box p.text {font-size: 3.86vw;line-height: 1.9;letter-spacing: 0.05em;font-weight: 400;text-align: left; margin-bottom: 7.25vw; position: relative; }
button.mfp-close{right: 6.45vw;top: 6.29vw;opacity: 0!important;z-index: 100000;}
#contents04 {position: relative;text-align: center;padding: 47.72vw 0 21.74vw;}
#contents04 .inner-Box {position: relative;}
#contents04 .inner-Box figure.img01 {position: absolute;top: -29.6vw;left: 3.7vw;width: 24.6vw;}
#contents04 .inner-Box figure.img01 img{  }
#contents04 .inner-Box h2 {margin-bottom: 1.62vw;position: relative;font-size: 5.8vw;line-height: 1.6;letter-spacing: 0.05em;font-weight: 700;text-align: center;}
#contents04 .inner-Box p.text {margin-bottom: 7.38vw;position: relative;font-size: 3.9vw;line-height: 1.9;letter-spacing: 0.05em;font-weight: 400;text-align: center;}
#contents04 .inner-Box figure.photo {position: relative;top: 0;left: 0;margin-bottom: 7.92vw;}
#contents04 .inner-Box figure.photo img{  }
#contents04 .inner-Box h3 {margin-bottom: 0.0vw;position: relative;font-size: 4.3vw;line-height: 1.8;letter-spacing: 0.05em;font-weight: 700;text-align: center;}
#contents04 .inner-Box figure.img02 {position: absolute;bottom: -37vw;right: 4.2vw;width: 25.4vw;}
#contents04 .inner-Box figure.img02 img{  }







  #recruit .recruit-single.system-contents {
    margin-top: 0;
    margin-bottom: 10vw;
    padding: 4vw 3vw;
    border: none;
    border-bottom: 1px solid #ccc;
  }

  #recruit .recruit-single__hero {
    display: flex;
    flex-direction: column;
    gap: 6vw;
  }

  #recruit .recruit-single__col--pic {
    order: -1;
  }

  #recruit .recruit-single__job {
    display: block;
    margin: 0 0 4vw;
    padding: 3vw 5vw;
    font-size: 3.6vw;
    font-weight: 700;
    line-height: 1.5;
    letter-spacing: 0.05em;
    color: #222;
    text-align: center;
    border: 1px solid #222;
    border-radius: 0;
    box-sizing: border-box;
  }

  #recruit .recruit-single__title {
    margin: 0 0 5vw;
    font-size: 5.6vw;
    font-weight: 700;
    line-height: 1.4;
    color: #222;
  }

  #recruit .recruit-single__pic img {
    display: block;
    width: 100%;
    height: auto;
  }

  #recruit .recruit-spec-wrap {
    margin-top: 8vw;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }

  #recruit .recruit-spec-table {
    width: 100%;
    min-width: 280px;
    border-collapse: collapse;
    border: 1px solid #ccc;
    font-size: 3.4vw;
    line-height: 1.65;
    color: #222;
    table-layout: fixed;
  }

  #recruit .recruit-spec-table__label {
    width: 32%;
    padding: 3vw;
    font-weight: 600;
    text-align: left;
    vertical-align: top;
    background: #e8e8e8;
    border: 1px solid #ccc;
  }

  #recruit .recruit-spec-table__value {
    width: 68%;
    padding: 3vw;
    vertical-align: top;
    background: #fff;
    border: 1px solid #ccc;
  }
}
