@charset "UTF-8";
/*
 * recruit.css
 * Last modify 2024/05/10 23:21
 */
@import url("https://fonts.googleapis.com/css2?family=BIZ+UDMincho:wght@400;700&family=BIZ+UDPMincho:wght@400;700&family=Cardo:wght@400;700&family=Zen+Kaku+Gothic+Antique&display=swap"); /* ==========================================================
!import
========================================================== */
/* ==========================================================
!mediaQuery
デザインベースは376px、1440px
========================================================== */
/* -----------------------------------------------------
Base Style
----------------------------------------------------- */
/* !main
---------------------------------------------------------- */
html.webp #main {
  background-image: url("../img/recruit/bg_main01.webp");
}
@media screen and (max-width: 880px) {
  html.webp #main {
    background-image: url("../img/recruit/bg_main01_sp.webp");
  }
}

html.no-webp #main {
  background-image: url("../img/recruit/bg_main01.jpg");
}
@media screen and (max-width: 880px) {
  html.no-webp #main {
    background-image: url("../img/recruit/bg_main01_sp.jpg");
  }
}

/* !content
---------------------------------------------------------- */
@media screen and (min-width: 881px) {
  #content {
    width: 85vw;
  }
}
@media screen and (min-width: 1281px) {
  #content {
    width: 1068px;
  }
}
@media screen and (min-width: 1441px) {
  #content {
    width: 74.16vw;
  }
}
#content h1.h1_basic01 {
  margin-bottom: 10.68vw;
}
@media screen and (min-width: 881px) {
  #content h1.h1_basic01 {
    margin-bottom: 1.87vw;
  }
}
@media screen and (min-width: 1281px) {
  #content h1.h1_basic01 {
    margin-bottom: 24px;
  }
}
@media screen and (min-width: 1441px) {
  #content h1.h1_basic01 {
    margin-bottom: 1.66vw;
  }
}
#content .h2Box {
  text-align: center;
}
#content .h2Box h2 {
  position: relative;
  display: inline-block;
  padding: 0 1.5em;
  color: #717171;
  font-size: 6.91vw;
  line-height: 1.5;
  letter-spacing: 0.1em;
}
@media screen and (max-width: 880px) {
  #content .h2Box h2 {
    display: block;
    padding: 0;
    line-height: 1.46;
  }
}
@media screen and (min-width: 881px) {
  #content .h2Box h2 {
    font-size: 2.5vw;
  }
}
@media screen and (min-width: 1281px) {
  #content .h2Box h2 {
    font-size: 32px;
  }
}
@media screen and (min-width: 1441px) {
  #content .h2Box h2 {
    font-size: 2.22vw;
  }
}
#content .h2Box h2:before, #content .h2Box h2:after {
  position: absolute;
  display: inline-block;
  content: "";
  width: 24px;
  height: 9px;
  top: 28%;
  background: url("../common/img/bg_h2_01.svg") no-repeat center center;
  background-size: 100%;
}
@media screen and (max-width: 880px) {
  #content .h2Box h2:before, #content .h2Box h2:after {
    top: 44%;
    background: url("../common/img/bg_h2_01_sp.svg") no-repeat center center;
  }
}
@media screen and (min-width: 881px) {
  #content .h2Box h2:before, #content .h2Box h2:after {
    width: 10vw;
    height: 1.87vw;
  }
}
@media screen and (min-width: 1281px) {
  #content .h2Box h2:before, #content .h2Box h2:after {
    width: 128px;
    height: 24px;
  }
}
@media screen and (min-width: 1441px) {
  #content .h2Box h2:before, #content .h2Box h2:after {
    width: 8.88vw;
    height: 1.66vw;
  }
}
#content .h2Box h2:before {
  left: 0;
}
@media screen and (min-width: 881px) {
  #content .h2Box h2:before {
    left: -10vw;
  }
}
@media screen and (min-width: 1281px) {
  #content .h2Box h2:before {
    left: -128px;
  }
}
@media screen and (min-width: 1441px) {
  #content .h2Box h2:before {
    left: -8.88vw;
  }
}
#content .h2Box h2:after {
  right: 0;
}
@media screen and (min-width: 881px) {
  #content .h2Box h2:after {
    right: -10vw;
  }
}
@media screen and (min-width: 1281px) {
  #content .h2Box h2:after {
    right: -128px;
  }
}
@media screen and (min-width: 1441px) {
  #content .h2Box h2:after {
    right: -8.88vw;
  }
}
#content .h2Box h2 strong {
  color: #BFB87D;
  font-size: 5.31vw;
  line-height: 1.4;
  font-weight: 500;
}
@media screen and (min-width: 881px) {
  #content .h2Box h2 strong {
    font-size: 1.87vw;
  }
}
@media screen and (min-width: 1281px) {
  #content .h2Box h2 strong {
    font-size: 24px;
  }
}
@media screen and (min-width: 1441px) {
  #content .h2Box h2 strong {
    font-size: 1.66vw;
  }
}
#content .h3Box {
  margin-top: 21.27vw;
  text-align: center;
}
@media screen and (min-width: 881px) {
  #content .h3Box {
    margin-top: 5vw;
  }
}
@media screen and (min-width: 1281px) {
  #content .h3Box {
    margin-top: 64px;
  }
}
@media screen and (min-width: 1441px) {
  #content .h3Box {
    margin-top: 4.44vw;
  }
}
#content .h3Box h3 {
  position: relative;
  display: inline-block;
  padding: 0 1.5em;
  color: #717171;
  font-size: 5.31vw;
  line-height: 1.5;
  letter-spacing: 0.1em;
}
@media screen and (max-width: 880px) {
  #content .h3Box h3 {
    display: block;
    padding: 0;
    line-height: 1.46;
  }
}
@media screen and (min-width: 881px) {
  #content .h3Box h3 {
    width: 53.12vw;
    margin: 0 auto;
    font-size: 1.87vw;
  }
}
@media screen and (min-width: 1281px) {
  #content .h3Box h3 {
    width: 680px;
    margin: 64px auto 0;
    font-size: 24px;
  }
}
@media screen and (min-width: 1441px) {
  #content .h3Box h3 {
    width: 47.22vw;
    margin: 4.44vw auto 0;
    font-size: 1.66vw;
  }
}
#content .h3Box h3:before, #content .h3Box h3:after {
  position: absolute;
  display: inline-block;
  content: "";
  width: 18px;
  height: 100%;
  top: 0;
  border-top: 1px solid #DAD4A4;
  border-bottom: 1px solid #DAD4A4;
}
@media screen and (min-width: 881px) {
  #content .h3Box h3:before, #content .h3Box h3:after {
    width: 1.25vw;
  }
}
@media screen and (min-width: 1281px) {
  #content .h3Box h3:before, #content .h3Box h3:after {
    width: 16px;
  }
}
@media screen and (min-width: 1441px) {
  #content .h3Box h3:before, #content .h3Box h3:after {
    width: 1.11vw;
  }
}
#content .h3Box h3:before {
  left: 0;
  border-left: 1px solid #DAD4A4;
}
@media screen and (min-width: 881px) {
  #content .h3Box h3:before {
    left: -1.25vw;
  }
}
@media screen and (min-width: 1281px) {
  #content .h3Box h3:before {
    left: -16px;
  }
}
@media screen and (min-width: 1441px) {
  #content .h3Box h3:before {
    left: -1.11vw;
  }
}
#content .h3Box h3:after {
  right: 0;
  border-right: 1px solid #DAD4A4;
}
@media screen and (min-width: 881px) {
  #content .h3Box h3:after {
    right: -1.25vw;
  }
}
@media screen and (min-width: 1281px) {
  #content .h3Box h3:after {
    right: -16px;
  }
}
@media screen and (min-width: 1441px) {
  #content .h3Box h3:after {
    right: -1.11vw;
  }
}
#content .h3Box h3 strong {
  color: #00B3CD;
  font-size: 5.31vw;
  line-height: 1.4;
  font-weight: 500;
}
@media screen and (min-width: 881px) {
  #content .h3Box h3 strong {
    font-size: 1.87vw;
  }
}
@media screen and (min-width: 1281px) {
  #content .h3Box h3 strong {
    font-size: 24px;
  }
}
@media screen and (min-width: 1441px) {
  #content .h3Box h3 strong {
    font-size: 1.66vw;
  }
}
#content p.cmnt {
  margin-bottom: 6.38vw;
  font-size: 5.31vw;
  line-height: 1.7;
  letter-spacing: 0.1em;
  text-align: center;
}
@media screen and (min-width: 881px) {
  #content p.cmnt {
    margin-bottom: 6.25vw;
    font-size: 1.87vw;
  }
}
@media screen and (min-width: 1281px) {
  #content p.cmnt {
    margin-bottom: 80px;
    font-size: 24px;
  }
}
@media screen and (min-width: 1441px) {
  #content p.cmnt {
    margin-bottom: 5.55vw;
    font-size: 1.66vw;
  }
}
#content p {
  font-size: 4.25vw;
  font-weight: 500;
  line-height: 2;
  letter-spacing: 0.1em;
}
@media screen and (min-width: 881px) {
  #content p {
    font-size: 1.4vw;
  }
}
@media screen and (min-width: 1281px) {
  #content p {
    font-size: 18px;
  }
}
@media screen and (min-width: 1441px) {
  #content p {
    font-size: 1.25vw;
  }
}
#content #section01,
#content #section02,
#content #section03 {
  margin-bottom: 12.76vw;
}
@media screen and (min-width: 881px) {
  #content #section01,
#content #section02,
#content #section03 {
    margin-bottom: 6.25vw;
  }
}
@media screen and (min-width: 1281px) {
  #content #section01,
#content #section02,
#content #section03 {
    margin-bottom: 80px;
  }
}
@media screen and (min-width: 1441px) {
  #content #section01,
#content #section02,
#content #section03 {
    margin-bottom: 5.55vw;
  }
}
#content .btnBack {
  padding-top: 80px;
}
@media screen and (max-width: 880px) {
  #content .btnBack {
    padding-top: 0;
  }
}

/* !bnrArea
---------------------------------------------------------- */
#bnrArea {
  margin: 12.76vw 0;
}
@media screen and (min-width: 881px) {
  #bnrArea {
    margin: 10.46vw 2.5vw 10.46vw 2.5vw;
  }
}
@media screen and (min-width: 1281px) {
  #bnrArea {
    margin: 134px 2.5vw 134px 2.5vw;
  }
}
@media screen and (min-width: 1441px) {
  #bnrArea {
    margin: 9.3vw 0 9.3vw 6.66vw;
  }
}
#bnrArea p {
  text-align: center;
}
#bnrArea p a img {
  transition: all 0.5s;
  max-width: 100%;
}
#bnrArea p a:hover img {
  opacity: 0.6;
}

/* !section01
---------------------------------------------------------- */
#section01 {
  position: relative;
}
@media screen and (min-width: 881px) {
  #section01 {
    min-height: 29.06vw;
    padding-top: 2.5vw;
    padding-right: 50.62vw;
    margin-bottom: 3.12vw !important;
  }
}
@media screen and (min-width: 1281px) {
  #section01 {
    min-height: 372px;
    padding-top: 32px;
    padding-right: 648px;
    margin-bottom: 40px !important;
  }
}
@media screen and (min-width: 1441px) {
  #section01 {
    min-height: 25.83vw;
    padding-top: 2.22vw;
    margin-bottom: 2.77vw !important;
  }
}
#section01 .slideWrap01 {
  position: absolute;
  top: 0;
  right: 0;
}
@media screen and (max-width: 880px) {
  #section01 .slideWrap01 {
    position: relative;
    top: auto;
    right: auto;
    margin: 10.38vw 0 17.02vw;
  }
}
@media screen and (min-width: 881px) {
  #section01 .slideWrap01 {
    width: 39.06vw;
  }
}
@media screen and (min-width: 1281px) {
  #section01 .slideWrap01 {
    width: 500px;
  }
}
@media screen and (min-width: 1441px) {
  #section01 .slideWrap01 {
    width: 33.78vw;
  }
}
#section01 .slideWrap01 img {
  border: 1px solid #DAD4A4;
}
@media screen and (min-width: 881px) {
  #section01 p {
    width: 38.43vw;
  }
}
@media screen and (min-width: 1281px) {
  #section01 p {
    width: 492px;
  }
}
@media screen and (min-width: 1441px) {
  #section01 p {
    width: 34.16vw;
  }
}

html.webp #concept:before {
  background: url("../img/about/pic_about01.webp") no-repeat center top;
  background-size: cover;
}
@media screen and (max-width: 880px) {
  html.webp #concept:before {
    background: url("../img/about/pic_about01_sp.webp") no-repeat center top;
    background-size: 100%;
  }
}

html.no-webp #concept:before {
  background: url("../img/about/pic_about01.jpg") no-repeat center top;
  background-size: cover;
}
@media screen and (max-width: 880px) {
  html.no-webp #concept:before {
    background: url("../img/about/pic_about01_sp.jpg") no-repeat center top;
    background-size: 100%;
  }
}

/* !section02
---------------------------------------------------------- */
#section02 {
  position: relative;
  border-top: 1px solid #DAD4A4;
  border-bottom: 1px solid #DAD4A4;
}
@media screen and (max-width: 880px) {
  #section02 {
    border: none;
  }
  #section02:before {
    margin-bottom: 8.51vw;
    position: relative;
    display: block;
    content: "";
    width: 100%;
    height: 53.19vw;
    border: 1px solid #DAD4A4;
  }
}
@media screen and (min-width: 881px) {
  #section02 {
    padding: 3.75vw 42.18vw 3.75vw 0;
    background-size: 38.43vw !important;
  }
  #section02 p {
    width: 38.43vw;
  }
}
@media screen and (min-width: 1281px) {
  #section02 {
    padding: 48px 540px 48px 0;
    background-size: 492px !important;
  }
  #section02 p {
    width: 492px;
  }
}
@media screen and (min-width: 1441px) {
  #section02 {
    padding: 3.33vw 37.5vw 3.33vw 0;
    background-size: 34.16vw !important;
  }
  #section02 p {
    width: 34.16vw;
  }
}

html.webp #section02 {
  background: url("../img/recruit/pic_sec02.webp") no-repeat right center;
}
@media screen and (max-width: 880px) {
  html.webp #section02 {
    background: none;
  }
}

html.no-webp #section02 {
  background: url("../img/recruit/pic_sec02.jpg") no-repeat right center;
}
@media screen and (max-width: 880px) {
  html.no-webp #section02 {
    background: none;
  }
}

@media screen and (max-width: 880px) {
  html.webp #section02:before {
    background: url("../img/recruit/pic_sec02_sp.webp") no-repeat center top;
    background-size: 100%;
  }
}

@media screen and (max-width: 880px) {
  html.no-webp #section02:before {
    background: url("../img/recruit/pic_sec02_sp.jpg") no-repeat center top;
    background-size: 100%;
  }
}

/* !section03
---------------------------------------------------------- */
#section03 {
  position: relative;
}
#section03 a {
  color: #00B3CD;
  text-decoration: underline;
  transition: all 0.3s;
}
#section03 a:hover {
  opacity: 0.6;
  text-decoration: none;
}
@media screen and (min-width: 881px) {
  #section03 {
    min-height: 26.56vw;
    padding-top: 4.53vw;
    padding-left: 46.92vw;
  }
}
@media screen and (min-width: 1281px) {
  #section03 {
    min-height: 340px;
    padding-top: 58px;
    padding-left: 575px;
  }
}
@media screen and (min-width: 1441px) {
  #section03 {
    min-height: 23.61vw;
    padding-top: 4.02vw;
    padding-left: 39.93vw;
  }
}
#section03:before {
  position: absolute;
  display: block;
  content: "";
  top: 0;
  left: 0;
  border: 1px solid #DAD4A4;
}
@media screen and (max-width: 880px) {
  #section03:before {
    position: relative;
    width: 100%;
    height: 53.19vw;
    left: auto;
    margin-bottom: 8.51vw;
  }
}
@media screen and (min-width: 881px) {
  #section03:before {
    width: 38.43vw;
    height: 26.56vw;
  }
}
@media screen and (min-width: 1281px) {
  #section03:before {
    width: 492px;
    height: 340px;
  }
}
@media screen and (min-width: 1441px) {
  #section03:before {
    width: 34.16vw;
    height: 23.61vw;
  }
}

html.webp #section03:before {
  background: url("../img/recruit/pic_sec03.webp") no-repeat right center;
  background-size: 100%;
}
@media screen and (max-width: 880px) {
  html.webp #section03:before {
    background: url("../img/recruit/pic_sec03_sp.webp") no-repeat center top;
    background-size: 100%;
  }
}

html.no-webp #section03:before {
  background: url("../img/recruit/pic_sec03.jpg") no-repeat right center;
  background-size: 100%;
}
@media screen and (max-width: 880px) {
  html.no-webp #section03:before {
    background: url("../img/recruit/pic_sec03_sp.jpg") no-repeat center top;
    background-size: 100%;
  }
}

/* !section04
---------------------------------------------------------- */
#section04 {
  position: relative;
  margin-bottom: 12.76vw;
}
@media screen and (min-width: 881px) {
  #section04 {
    min-height: 26.56vw;
    margin-bottom: 9.37vw;
    padding-top: 0;
    padding-right: 42.18vw;
  }
  #section04 p {
    width: 38.43vw;
  }
}
@media screen and (min-width: 1281px) {
  #section04 {
    min-height: 340px;
    margin-bottom: 120px;
    padding-top: 0;
    padding-right: 540px;
  }
  #section04 p {
    width: 492px;
  }
}
@media screen and (min-width: 1441px) {
  #section04 {
    min-height: 23.61vw;
    margin-bottom: 8.33vw;
    padding-top: 0;
    padding-right: 37.5vw;
  }
  #section04 p {
    width: 34.16vw;
  }
}
#section04:before {
  position: absolute;
  display: block;
  content: "";
  top: 0;
  right: 0;
  border: 1px solid #DAD4A4;
}
@media screen and (max-width: 880px) {
  #section04:before {
    position: relative;
    width: 100%;
    height: 53.19vw;
    right: auto;
    margin-bottom: 8.51vw;
  }
}
@media screen and (min-width: 881px) {
  #section04:before {
    width: 38.43vw;
    height: 26.56vw;
  }
}
@media screen and (min-width: 1281px) {
  #section04:before {
    width: 492px;
    height: 340px;
  }
}
@media screen and (min-width: 1441px) {
  #section04:before {
    width: 34.16vw;
    height: 23.61vw;
  }
}

html.webp #section04:before {
  background: url("../img/recruit/pic_sec04.webp") no-repeat right center;
  background-size: 100%;
}
@media screen and (max-width: 880px) {
  html.webp #section04:before {
    background: url("../img/recruit/pic_sec04_sp.webp") no-repeat center top;
    background-size: 100%;
  }
}

html.no-webp #section04:before {
  background: url("../img/recruit/pic_sec04.jpg") no-repeat right center;
  background-size: 100%;
}
@media screen and (max-width: 880px) {
  html.no-webp #section04:before {
    background: url("../img/recruit/pic_sec04_sp.jpg") no-repeat center top;
    background-size: 100%;
  }
}

/* !detail
---------------------------------------------------------- */
#detail {
  position: relative;
  margin-top: 12.76vw;
  margin-bottom: 12.76vw;
}
@media screen and (min-width: 881px) {
  #detail {
    margin-bottom: 10.46vw;
  }
}
@media screen and (min-width: 1281px) {
  #detail {
    margin-bottom: 134px;
  }
}
@media screen and (min-width: 1441px) {
  #detail {
    margin-bottom: 9.3vw;
  }
}
#detail h2 {
  margin-bottom: 4.25vw;
  color: #BFB87D;
  font-size: 5.31vw;
  font-weight: 400;
  line-height: 1.4;
  letter-spacing: 0.1em;
  text-align: left;
}
@media screen and (max-width: 880px) {
  #detail h2 {
    text-align: center;
  }
}
@media screen and (min-width: 881px) {
  #detail h2 {
    margin-bottom: 1.87vw;
    font-size: 1.87vw;
  }
}
@media screen and (min-width: 1281px) {
  #detail h2 {
    margin-bottom: 24px;
    font-size: 24px;
  }
}
@media screen and (min-width: 1441px) {
  #detail h2 {
    margin-bottom: 1.66vw;
    font-size: 1.66vw;
  }
}
#detail table th {
  width: 12em;
  font-weight: 700;
  vertical-align: middle;
}
@media screen and (max-width: 880px) {
  #detail table th {
    width: 7em;
  }
}
@media screen and (min-width: 881px) {
  #detail table th {
    font-size: 1.25vw;
  }
}
@media screen and (min-width: 1281px) {
  #detail table th {
    font-size: 16px;
  }
}
@media screen and (min-width: 1441px) {
  #detail table th {
    font-size: 1.11vw;
  }
}
@media screen and (min-width: 881px) {
  #detail table td {
    font-size: 1.25vw;
  }
}
@media screen and (min-width: 1281px) {
  #detail table td {
    font-size: 16px;
  }
}
@media screen and (min-width: 1441px) {
  #detail table td {
    font-size: 1.11vw;
  }
}
#detail table td strong {
  color: #00B3CD;
  font-weight: 400;
}

/* !apply
---------------------------------------------------------- */
#apply {
  position: relative;
}
@media screen and (min-width: 881px) {
  #apply {
    padding-left: 46.92vw;
  }
}
@media screen and (min-width: 1281px) {
  #apply {
    padding-left: 575px;
  }
}
@media screen and (min-width: 1441px) {
  #apply {
    padding-left: 39.93vw;
  }
}
#apply .slideWrap01 {
  position: absolute;
}
@media screen and (max-width: 880px) {
  #apply .slideWrap01 {
    position: relative;
  }
}
@media screen and (min-width: 881px) {
  #apply .slideWrap01 {
    left: -7.5vw;
    width: 46.87vw;
  }
}
@media screen and (min-width: 1281px) {
  #apply .slideWrap01 {
    left: -12.5vw;
    width: 657px;
  }
}
@media screen and (min-width: 1441px) {
  #apply .slideWrap01 {
    left: -12.92vw;
    width: 46.66vw;
  }
}
#apply h2 {
  margin-bottom: 4.25vw;
  color: #BFB87D;
  font-size: 5.31vw;
  font-weight: 400;
  line-height: 1.4;
  letter-spacing: 0.1em;
  text-align: left;
}
@media screen and (max-width: 880px) {
  #apply h2 {
    text-align: center;
  }
}
@media screen and (min-width: 881px) {
  #apply h2 {
    margin-bottom: 1.87vw;
    font-size: 1.87vw;
  }
}
@media screen and (min-width: 1281px) {
  #apply h2 {
    margin-bottom: 24px;
    font-size: 24px;
  }
}
@media screen and (min-width: 1441px) {
  #apply h2 {
    margin-bottom: 1.66vw;
    font-size: 1.66vw;
  }
}
#apply h3 {
  margin-bottom: 3.19vw;
  font-size: 3.72vw;
  font-weight: 700;
  line-height: 1.7;
  letter-spacing: 0.1em;
}
@media screen and (max-width: 880px) {
  #apply h3 {
    text-align: center;
  }
}
@media screen and (min-width: 881px) {
  #apply h3 {
    margin-bottom: 0.93vw;
    font-size: 1.25vw;
  }
}
@media screen and (min-width: 1281px) {
  #apply h3 {
    margin-bottom: 12px;
    font-size: 16px;
  }
}
@media screen and (min-width: 1441px) {
  #apply h3 {
    margin-bottom: 0.83vw;
    font-size: 1.11vw;
  }
}
#apply #am {
  margin-top: 12.76vw;
  margin-bottom: 12.76vw;
}
#apply #am p {
  margin-bottom: 1em;
}
#apply table th {
  width: 4em;
  font-weight: 700;
  vertical-align: middle;
}
@media screen and (min-width: 881px) {
  #apply table th {
    font-size: 1.25vw;
  }
}
@media screen and (min-width: 1281px) {
  #apply table th {
    font-size: 16px;
  }
}
@media screen and (min-width: 1441px) {
  #apply table th {
    font-size: 1.11vw;
  }
}
@media screen and (min-width: 881px) {
  #apply table td {
    font-size: 1.25vw;
  }
}
@media screen and (min-width: 1281px) {
  #apply table td {
    font-size: 16px;
  }
}
@media screen and (min-width: 1441px) {
  #apply table td {
    font-size: 1.11vw;
  }
}
#apply table td strong {
  color: #00B3CD;
  font-weight: 400;
}
/*# sourceMappingURL=recruit.css.map */