@charset "utf-8";

/* *,*:before,*:after {
    outline: 2px solid red!important;
} */


/*　Reset CSS　*/

html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
  margin:0;
  padding:0;
  border:0;
  outline:0;
  /* font-size:100%; */
  vertical-align:baseline;
  background:transparent;
}
body {
  line-height:1;
}
article,aside,details,figcaption,figure,
footer,header,hgroup,menu,nav,section {
  display:block;
}
nav ul {
  list-style:none;
}
blockquote, q {
  quotes:none;
}
blockquote:before, blockquote:after,
q:before, q:after {
  content:'';
  content:none;
}
a {
  margin:0;
  padding:0;
  font-size:100%;
  vertical-align:baseline;
  background:transparent;
  text-decoration: none;
}
a:hover{
  transition: 0.2s;
  text-decoration: none;
  }

ins {
  background-color:#ff9;
  color:#000;
  text-decoration:none;
}
mark {
  background-color:#ff9;
  color:#000;
  font-style:italic;
   font-weight:bold;
}
del {
  text-decoration: line-through;
}
abbr[title], dfn[title] {
  border-bottom:1px dotted;
  cursor:help;
}
table {
  border-collapse:collapse;
  border-spacing:0;
}
/* change border colour to suit your needs */
hr {
  display:block;
  height:1px;
  border:0;
  border-top:1px solid #cccccc;
  margin:1em 0;
  padding:0;
}
input, select {
  vertical-align:middle;
}
/*　-END- Reset CSS　*/

/* タップしたときの青を消す */
*:focus {
  outline: none;
}
body {
  -webkit-tap-highlight-color: transparent;
}

/* base.cssの修正 */

html , body {
  font-family: "Noto Sans JP", sans-serif !important; 
  color: var(--brown);
  line-height: 1.5em;
  letter-spacing: 0.16em;
  background-color: #F8F6EC;
  display: block;
  font-feature-settings: "palt";
  /* overflow: hidden; */
  overflow-x: hidden;
}
li{
  list-style: none;
}
p {
  line-height:1.6em;
}
img {
  max-width: 100%;
  height: auto;
}
.headerMenu_fb img{
	width: 14%;
}
.headerMenuPC{
	letter-spacing: 0.1em;
	font-feature-settings: "palt" 0;
}
.headerMenuBtnBlock_list a img{
  margin-bottom: 0 !important;
}
footer{
	letter-spacing: 0.075em;
	font-feature-settings: "palt" 0 !important;
}
::selection{
  background-color: revert;
}

/* 変数 */
:root {
  --white: #ffffff; 
  --green: #78C633;
  --brown: #776136;
  --camel: #DEB054;
  --blue: #96C4C4;
  --brown02: #F1ECDD;
  --brown03: #D4C19C;
  --font01: 'Zen Maru Gothic', sans-serif;
}
section{
  object-fit: contain;
  text-align: center;
}
h1 {
  letter-spacing: 0;
}

/* 改行指定 */
.br-pc { display:block; }
.br-sp { display:none; }
@media screen and (max-width: 950px){   
  .br-pc { display:none; }
  .br-sp{ display:block;}
}

/* 幅指定 */
.wrapper{
  width: 100%;
  margin: 0 auto; 
}
.inner{
  width: 100%;
  max-width: 1000px;
  margin: 0 auto;
  padding: 0;
}
@media screen and (max-width:1023px){   
.inner{
  padding: 0 6vw;
}
}

/* 右横余白防止 */
*, *::before, *::after {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

/* ズームイン */
.zoom {
width: 300px;
height: 200px;
overflow: hidden
}
.zoom-1 img {
width: 100%;
max-width: 100%;
height: auto;
animation: animationZoom1 5s ease-in-out forwards;
}
@keyframes animationZoom1 {
100% { transform: scale(1.1)}
}
.zoom-2 img {
width: 100%;
max-width: 100%;
height: auto;
animation: animationZoom2 10s ease-in-out infinite;
}
@keyframes animationZoom2 {
50% { transform: scale(1.1)}
}

body{
  overflow-x: hidden;
}

/* フェードイン */

.fadeIn {
  transition: 0.8s ease-in-out;
  transform: translateY(30px);
  opacity: 0;
}
.fadeIn.on {
  transform: translateY(0);
  opacity: 1.0;
}
.timing02 {transition-delay: .2s;}
.timing03 {transition-delay: .4s;}
.timing04 {transition-delay: .6s;}
.timing05 {transition-delay: .8s;}

main {
  overflow: hidden;
}

/* パンくず */
.rn-bcnav{
  text-align: right;
}
.rn-bcnav .liPnav{
  padding-left: 0;
  max-width: 1000px;
  min-width: none;
  margin: 0 auto 20px;
}
.rn-bcnav .liPnav a{
  color: var(--brown);
}
.rn-bcnav .liPnav a::before{
  background-color: var(--brown);
}
.rn-bcnav .liPnav li{
  color: var(--camel);
  font-size: 0.9em;
}

section h1{
  font-family: var(--font01); 
  font-size: 32px;
  color: var(--white);
  letter-spacing: 0;
  text-align: center;
}
@media screen and (max-width:768px){ 
  section{
    text-align: left;
  }
  .inner{
    padding: 0 16px;
  }
}
#pagetop a {
  background-color: var(--brown);
}

/* #top */

section#mainvisual{
  display: block;
  position: relative;
  padding: 100px 80px 0;
  margin-bottom: 40px;
}
@media screen and (max-width:1023px){ 
section#mainvisual{
  padding: 80px 2vw 200px;
}
}
.mv-catch{
  position: absolute;
  top: 10%;
  right:8%;
  z-index: 1;
  width: min(24vw 402px);
}
.mv-catch img{
  width: 24vw;
}
section#mainvisual .img-wrap{
  width: 90%;
  height: 100%;
  margin: 0 auto;
  border-radius: 20px;
}
section#mainvisual picture{
  border-radius: 20px;
}
@media screen and (max-width:768px){
  .mv-catch{
    top: 180px;
    left: 20%;
    width: auto;
  }
  .mv-catch img{
    width: 56vw;
  }
}
.mv-topic {
  position: absolute;
  bottom: 2%;
  left: 12%;
  text-align: left;
}
.mv-topic li{
  background-color: var(--white);
  margin-bottom: 10px;
  border-radius: 30px;
  font-size: 1em;
  padding:0 20px;
  letter-spacing: 0.09em;
  position: relative;
  opacity: 0.95;
}
.mv-topic li::after{
 content: '';
  width: 8px;
  height: 8px;
  border: 0;
  border-top: solid 2px var(--brown);
  border-right: solid 2px var(--brown);
  transform: rotate(45deg);
  position: absolute;
  top: 0;
  right: 16px;
  bottom: 0;
  margin: auto;
}
.mv-topic li a {
  display: block;
  padding: 8px 16px 8px 0;
  color: var(--brown);
  width: 100%;
  height: 100%;
  cursor: pointer;
}
.mv-topic li span {
  display: inline;
  margin: 2px 0;
  font-weight: 500;
}
.mv-topic li span.tag{
  color: var(--white);
  padding: 6px 4px;
  margin-right: 10px;
  width: 8em;
  display: inline-block;
  text-align: center;
  font-size: 0.9em;
  border-radius: 2px;
  vertical-align: middle;
  line-height:1.1em;
}
.mv-topic li span.tag-c01{
  background-color: var(--brown);
}
.mv-topic li span.tag-c02{
  background-color: var(--green);
}
.mv-topic li:hover {
  transform: translateY(-2px);
  transition: .2s cubic-bezier(0.45, 0, 0.55, 1);
}

@media screen and (max-width:768px){
  .mv-topic {
    bottom: -8%;
    left: 50%;
    text-align: left;
    width: 90%;
    transform: translateX(-50%);
  }
  .mv-topic li {
    border-radius: 8px;
    box-shadow: 0px 2px 0px 0 var(--camel);
    }
  .mv-topic li p {
    display:block;
  }
  .mv-topic li span.tag {
    margin-bottom: 4px;
    padding: 2px 2px;
     width: 170px;
     display: block;
  }
  }

/* cont-lead */
#cont-lead{
  position: relative;
	z-index: 0;
}
#cont-lead p{
  line-height: 1.7;
}
#cont-lead h2{
  font-size: 2em;
  margin-bottom: 40px;
  letter-spacing: 0.04em;
  line-height: 1.6em;
  font-family: var(--font01); 
  color: var(--camel);
  text-align: center;
}
#cont-lead h2 span{
  font-family: var(--font01); 
  font-weight: 900;
}
#page-benefits #cont-lead h2 , #page-interview #cont-lead h2{
  font-size: 1.8em;
  letter-spacing: 0.03em;
  margin: 30px 0 50px;
}
#top #cont-lead{
  margin: 40px 0;
}
#top .top-lead h2::before{
  content: "";
  position: absolute;
  top: -10%;
  left: 15%;
  width: 16%;
  height: 100%;
  background-image: url("../../asset/img/recruitment_rn/rm_ilst04.svg");
  background-size: contain; 
  background-repeat: no-repeat;
  opacity: 0.8;
  z-index: -1;
}
#cont-lead h1 span{
  font-size: 1.4em;
}
#cont-lead p.text-strong span{
  font-weight: 600;
  font-size: 1.6em;
  margin-top: 20px;
  text-align: center;
  display: block;
}

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

#top .top-lead h2::before{
  top: -2%;
  left: 3%;
  width: 28%;
  height: 28%;
}
#cont-lead p{
  text-align: left;
}
#cont-lead h2{
  font-size: 1.5em;
  text-align: center;
}
#top #cont-lead h2{
  margin: 80px auto 40px;
}
#cont-lead h2::before{
  top: -8%;
  left: 0;
  width: 24%;
}
#cont-lead h2 span{
  font-size: 1.2em;
}
#cont-lead p.text-strong span{
  font-size: 1.5em;
}
}

/* top-anchor-navi */
.navi-container {
  display: grid;
  grid-template-columns: repeat(3, 1fr); /* 3列 */
  grid-template-rows: repeat(2, 1fr); /* 2行 */
  grid-gap: 10px;
}
.navi-box {
  background-color: var(--green);
  text-align: center;
  font-size: 1.1em;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  line-height: 1.2;
  margin: 10px;
  padding: 4px;
  
}
#top .navi-box {
  outline: solid 1px #c7e3af !important;
  outline-offset: -6px !important;
}
li.navi-box a{
  display: block;
  color: #fff;
  padding: 24px 0;
  /* margin: 8px; */
  width: 100%;
  font-size: 1.1em;
}
li.navi-box:hover{
  opacity: 0.4;
  transition: opacity 0.4s;
}
.arrow {
  display: inline-block;
}
.arrow:after {
  content: '';
  width: 0;
  height: 0;
  border-style: solid;
  border-color: transparent transparent transparent #fff;
  border-width: 0.3em 0.35em;
  position: absolute;
  top: 6px;
  right: 16px;
  bottom: 4px;
  margin: auto;
}

@media screen and (max-width:768px){
  .navi-container {
    display: grid;
    grid-template-columns: repeat(2, 1fr); /* 3列 */
    grid-template-rows: repeat(3, 1fr); /* 2行 */
    grid-gap: 16px;
    /* margin-top: 32px; */
  }
  .navi-box {
    padding: 8px 0;
    line-height: 1.2;
    letter-spacing: 0.08em;
    font-size: 1.08em;
    margin: 4px;
  }
  #page-job .arrow:after {
    right: 2px;
  }
}

/* cont-01 */
.cont-01{
  margin: 160px auto 0;
  position: relative;
  width: fit-content;
}
.deco01 , .deco02 , .deco03 , .deco04 , .deco05 , .deco06{
  position: absolute;
  z-index: 1;
  opacity: 0.8;
  top: 50%;
  right: 50%;
}
.deco01{
  transform: translate(160% , -160%);
  width: 260px;
}
.deco02{
  transform: translate(-160% , -140%);
  width: 180px;
}
.deco03{
  transform: translate(300% , -160%);
  width: 160px;
}
.deco04{
  transform: translate(-100% , -150%);
  width: 240px;
}
.deco05{
  transform: translate(200% , -150%);
  width: 240px;
}
.deco06{
  transform: translate(-230% , -160%);
  width: 150px;
}
.cont-01 .title-area {
  position: absolute;
  width: 50%;
  top: -8%;
  padding: 48px 0;
}
.cont-01 h2 {
  color: var(--camel);
  font-family: var(--font01);
  font-size: 1.6em;
  text-align: left;
  margin-bottom: 24px;
  position: relative;
	letter-spacing: 0.06em;
}
.cont-01 h2::before , .cont-03 h3::before {
  content: "●";
  font-size: 0.8em;
  color: var(--blue);
  padding-bottom: 4px;
}
.cont-01 h2::after{
  content: "";
  padding-top: 40px;
  position: absolute;
  bottom: 0;
  left:57%;
  width: 45%;
  height: 100%;
  background-image: url("../../asset/img/recruitment_rn/rm_ilst02.svg");
  background-size: contain;
  background-repeat: no-repeat;
}
.ro2-title{
  left:50%;
}
.ro2-title h2{
  padding-left: 10px;
}
.cont-01 .text-area{
  margin: 64px 0 0;
  width: 50%;
  height: auto;
}
.cont-01 .text-box{
  background: var(--white);
  padding: 32px;
  text-align: left;
  letter-spacing: 0.1em;
}
.cont-01 .img-area {
  width: 50%;
}
.cont-01 .img-area img{
  width: 100%;
  border-radius: 20px;
}
.btn01{
  background-color: var(--green);

  margin: 20px 0 0;
  text-align: center;
  font-size: 1.1em;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 100vh;
  width: 180px;
  height: 44px;
  transition: opacity 0.4s;
}
.btn01 a{
  display: block;
  color: var(--white);
  padding: 2px 0;
  width: 100%;
}
.btn01:hover{
  opacity: 0.4;
  transition: opacity 0.6s;
}
@media screen and (max-width:768px){
  .cont-01{
  margin: 160px auto 0;
  }
  .cont-01 .title-area {
    width: auto;
    top:-12%;
  }
  .cont-01 .text-area{
    width: 100%;
  }
  .deco01{
  transform: translate(110% , -250%);
  width: 40%;
  }
  .deco02{
  transform: translate(120% , -230%);
  width: 140px;
  }
  .deco03{
  transform: translate(140% , -230%);
  width: 30%;
  }
  .deco04{
  transform: translate(110% , -260%);
  width: 40%;
  }
  .deco05{
  transform: translate(110% , -230%);
  width: 40%;
  }
  .deco06{
  transform: translate(190% , -270%);
  width: 24%;
  }
  .title-area {
  top: -10%;
  width: 100%;
  }
  .cont-01 h2::after{
  padding-top:60px; 
  margin-left: 0px;
  left:0;
  top: 50%;
  transform: translate(0 , -200%);
  background-image: url("../../asset/img/recruitment_rn/rm_ilst03.svg"); 
  width: 90vw;
  }
   .cont-01 .ro2-title h2::after{
  left:10%;
   }
  .ro2-title{
  left:0;
  margin-left: 0;
  }
  .ro2-title h2{
    padding-left: 16px;
  }
  .cont-01 .text-area{
    width: 100%;
    margin-top: 16px;
    margin-left: 0;
  }
  .cont-01 .img-area{
    width: 100%;
    margin-top: 40px;
    text-align: center;
  }
  .btn01{
    width: 100%;
  }
  .img-area {
    margin: 20px auto 0;
    text-align: center;
    width: 80%;
}
}

/* レイアウト左右位置変更 */
.flex{
  display: flex;
}
.ro1 .text-area{
 order:1;
}
.ro1 .img-area{
 order:2;
}
.ro2 .text-area{
 order:2;
}
.ro2 .img-area{
 order:1;
}
@media screen and (max-width:768px){
  .flex {
    display: grid;
    flex-direction: column;
  }
  .ro1 .text-area , .ro2 .text-area{
  order:2;
  }
  .ro1 .img-area , .ro2 .img-area{
  order:1;
  }
}

/* section#cont-inq お問い合わせ*/
#cont-inq {
  margin: 120px 0;
}
#cont-inq .inq-wrap{
  max-width: 840px;
  background-color: var(--brown02);
  text-align: center;
  padding: 32px;
  border-radius: 20px;
  margin: 0 auto;
}
#cont-inq h2{
  font-size: 2.5em;
  font-family: var(--font01);
  color: var(--camel);
  margin-bottom: 32px;
}
#cont-inq p{
  font-size: 1.25em;
  line-height: 1.4;
}
#cont-inq .btn-area{
  display: inline-block;
}
.btn02{
  background-color: var(--brown);
  padding: 2px 0;
  margin: 32px 0;
  cursor: pointer;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 100vh;
  width: 32vw;
  height: 68px;
  transition: opacity 0.4s;
}
.btn02 a{
  color: var(--white);
  font-size: 1.4em;
  letter-spacing: 0.06em;
}
.btn02:hover{
  opacity: 0.4;
  transition: opacity 0.6s;
}
.tel-area{
  display: inline-block;
  margin: 0 auto;
  line-height: 3;
}
.tel-num{
  font-size: 1.4em;
  font-weight: 600;
  letter-spacing: 0.02em;
  vertical-align: middle;
}
.tel-time{
  font-size: 0.9em;
  background-color: var(--white);
  letter-spacing: 0.06em;
  padding: 4px 16px;
  margin: 4px 0 0 16px;
  border-radius: 4px;
}

@media screen and (max-width:768px){
  #cont-inq{
    margin-top: 80px;
  }
  #cont-inq .inq-wrap{
    width: auto;
    padding: 32px 16px;
  }
  #cont-inq h2{
  font-size: 2.3em;
  }
  .btn02{
    max-width: 300px;
    width: 80vw;
  }
  .btn02 a{
  font-size: 1.2em;
}
.tel-num{
  display: inline-block;
  margin-bottom: 16px;
}
}

/* section#cont-bnr 外部バナーエリア*/
#cont-bnr{
  background-color: var(--white);
  padding: 60px;
  margin: 0;
}
#cont-bnr ul li {
  display: inline-block;
  margin: 0 20px;
}
#cont-bnr ul li a {
  display: block;
  padding: 12px 20px 0;
  border: solid 1px #ccc;
}

@media screen and (max-width:768px){
  #cont-bnr{
    text-align: center;
    padding: 32px 0 12px;
  }
  #cont-bnr ul li {
  display: inline-block;
  margin-bottom: 20px;
  }
}

/* #pege-works 職種紹介 */

.eyecatch{
  display: block;
  position: relative;
  margin: 100px 0 10px;
  /* margin-bottom: 0; */
}
.eyecatch .title-area{
  position: absolute;
  top: 50%;
  left:50%;
  transform: translate(-50%,-50%);
}
h1.ec-title{
  color: var(--white);
  letter-spacing: 0.3em;
  position: relative;
  font-weight: 700;
}
h1.ec-title::before{
  content: "";
  position: absolute;
  width: 240px;
  height: 22vw;
  background-size: contain; /* または cover, auto, 数値 */
  background-repeat: no-repeat;
  opacity: 0.8;
  z-index: -1;
}

/* アイキャッチ内の装飾 */

#page-works .eyecatch h1.ec-title::before{
  background-image: url("../../asset/img/recruitment_rn/rm_ilst09.svg");
  top: 70%;
  /* right: -160px; */
  left: -100%;
}
#page-benefits .eyecatch h1.ec-title::before{
  background-image: url("../../asset/img/recruitment_rn/rm_ilst07.svg");
  top: -500%;
  right: 110%;
  width: 100%;
}
#page-training .eyecatch h1.ec-title::before{
  background-image: url("../../asset/img/recruitment_rn/rm_ilst06.svg");
  top: -50%;
  right: -100%;
  width: 14vw;
  max-width: 200px;
}
#page-interview .eyecatch h1.ec-title::before{
  background-image: url("../../asset/img/recruitment_rn/rm_ilst11.svg");
  top: -720%;
  right: -110px;
  width: 250px;
}
#page-job .eyecatch h1.ec-title::before{
  background-image: url("../../asset/img/recruitment_rn/rm_ilst09.svg");
  top: 40%;
  right: 110px;
  width: 240px;
}
.eyecatch .img-wrap{
  background-color: #000;
}
.eyecatch .img-wrap img{
  width: 100%;
  height: auto;
  max-height: 480px;
  object-fit: cover;
  opacity: 0.8;
  display: block;
}

@media screen and (max-width:768px){
  .eyecatch{
    padding: 0;
    right: 0;
    margin: 70px 0 10px;
  }
  #page-works .eyecatch h1.ec-title::before{
    top: 50%;
    left:50%;
    transform: translate(-100%,10%);
    width: 30%;
}
  #page-benefits .eyecatch h1.ec-title::before{
    top: -330%;
    right: 68%;
    width: 24vw;
    height: 24vw;
}
  #page-training .eyecatch h1.ec-title::before{
    top: 50%;
  right: 20%;
  width: 24vw;
}
  #page-interview .eyecatch h1.ec-title::before{
    top: -330%;
    right: 50px;
    width: 160px;
    height: 160px;
}
  #page-job .eyecatch h1.ec-title::before{
    top:110%;
    right: 100px;
  }
}
#works-anchor-navi .navi-container {
  display: grid;
  grid-template-columns: repeat(3, 1fr); 
  grid-template-rows: repeat(auto);
  grid-gap: 30px;
  margin-bottom: 100px;
}
#works-anchor-navi li{
  position: relative;
  content: "";
  cursor: pointer;
  background-size: cover;
  background-repeat: no-repeat;
  text-align: center;
  border-radius: 10px;
}
#works-anchor-navi li a{
  width: 100%;
  /* max-width:312px; */
  aspect-ratio: 1.2 / 1;
   display: block;
}
#works-anchor-navi li a span{
  position: absolute;
  top: 80%;
  left: 50%;
  transform: translateX(-50%);
  color: var(--white);
  background-color: var(--green);
  padding: 6px 0;
  border-radius: 100vh;
  width: 80%;
  letter-spacing: 0.08em;
  line-height: 1.2;
  display: inline-block;
  font-size: 1.2em;
}
#works-anchor-navi li:hover{
  opacity: 0.5;
  transition: opacity 0.4s;
}
#works-anchor-navi .works01{
  background-image: url("../../asset/img/recruitment_rn/rm_works_tmb01.webp");
}
#works-anchor-navi .works02{
  background-image: url("../../asset/img/recruitment_rn/rm_works_tmb02.webp");
}
#works-anchor-navi .works03{
  background-image: url("../../asset/img/recruitment_rn/rm_works_tmb03.webp");
}
#works-anchor-navi .works04{
  background-image: url("../../asset/img/recruitment_rn/rm_works_tmb04.webp");
  letter-spacing: 0.08em;
}
#works-anchor-navi .works05{
  background-image: url("../../asset/img/recruitment_rn/rm_works_tmb05.webp");
}
#works-anchor-navi .works06{
  background-image: url("../../asset/img/recruitment_rn/rm_works_tmb06.webp");
}
#works-anchor-navi .works07{
  background-image: url("../../asset/img/recruitment_rn/rm_works_tmb07.webp");
}
#works-anchor-navi .works08{
  background-image: url("../../asset/img/recruitment_rn/rm_works_tmb08.webp");
}
#works-anchor-navi .works09{
  background-image: url("../../asset/img/recruitment_rn/rm_works_tmb09.webp");
}
#works-anchor-navi .works10{
  background-image: url("../../asset/img/recruitment_rn/rm_works_tmb10.webp");
}
#works-anchor-navi .works11{
  background-image: url("../../asset/img/recruitment_rn/rm_works_tmb11.webp");
}

@media screen and (max-width:768px){
#works-anchor-navi .navi-container {
  grid-template-columns: repeat(2, 1fr); /* 2列 */
  grid-template-rows: repeat(auto); /* 3行 */
  grid-gap: 4vw;
  margin-bottom: 100px;
}
#works-anchor-navi li a{
  padding: 6px 1em;
  border-radius: 8px;
  font-size: 0.9em;
    aspect-ratio: 1 / 1;
}
#works-anchor-navi li a span{
  top: 70%;
  left: 50%;
  transform: translateX(-50%);
  padding: 6px 0;
  border-radius: 8px;
  width: 90%;
  letter-spacing: 0.06em;
  line-height: 1.2;
  display: inline-block;
}
}
#page-works #cont-lead , #page-training #cont-lead , #page-job #cont-lead , #page-interview #cont-lead {
  background-image: url("../../asset/img/recruitment_rn/rm_ilst02.svg");
  background-repeat: no-repeat;
  padding: 20px 0 110px;
  margin-bottom: 20px;
  background-position: bottom;
  background-size: 18em;
}
#page-benefits #cont-lead {
  margin-bottom: 60px;
}

@media screen and (max-width:768px){
#page-works #cont-lead　, #page-training #cont-lead , #page-job #cont-lead , #page-interview #cont-lead {
  background-image: url("../../asset/img/recruitment_rn/rm_ilst03.svg");
  background-size: 90%;
}
}
/* #cont-lead .cont-wrap{
  margin-bottom: 60px;
} */
.cont-02{
  overflow: hidden;
}
.cont-02 .title-area-wrap01 {
  margin-left: 0;
  margin-right: auto;
  width: 50%;
}
.cont-02 .title-area-wrap02 {
  margin-right: 0;
  margin-left: auto;
  width: 50%;
}
.cont-02 .title-area-01 {
  background-color: var(--camel);
  padding: 12px 0;
  border-radius: 100vh;
  position: relative;
  margin-left: calc(50% - 50vw);
  padding-left: calc(50vw - 50%);
  padding-right: calc(50vw - 50%);
  margin-top: 60px;
}
.cont-02 .title-area-01 picture {
  position: absolute;
  top:-62px;
  left: 47%;
}
.cont-02 .title-area-02 picture{
  position: absolute;
  top:-64px;
  left: -1%;
}
.cont-02 .title-area-02 {
  background-color: var(--camel);
  padding: 12px 0;
  border-radius: 100vh;
  position: relative;
  margin-right: calc(50% - 50vw);
  margin-left: -30px;
  padding-right: calc(50vw - 50%);
  padding-left: 30px;
  margin-top: 64px;
}
.cont-02 .title-area-01 h2 , .cont-02 .title-area-02 h2 {
  position: relative;
  font-family: var(--font01);
  font-size: 1.8em;
  font-weight: 600;
  color: var(--white);
  text-align: left;
  width: 100vw;
  }
.cont-02 .img-area {
  margin-top: 40px;
}
.cont-02 .img-area img {
  width: 80%;
  max-width: 480px;
  text-align: left;
}
.cont-02 .cont-wrap .text-area {
  margin: 32px 0;
  width: 60%;
}
.cont-02 .text-area h3 {
  font-size: 1.6em;
  margin: 24px 0;
  text-align: left;
  line-height: 1.2em;
}
.cont-02 h4{
  color: #DEB054;
  text-align: left;
  font-size: 1.2em;
  padding: 0.2em 0.5em;
  background: transparent;
  border-left: solid 7px var(--blue);
  margin-top: 32px;
  line-height: 1.6;
  letter-spacing: 0.12em;
}
.cont-02 .text-area p{
  margin-top: 40px;
  text-align: left;
  letter-spacing: 0.16em;
}
.cont-02 .btn-area{
  text-align: left;
  margin-bottom: 60px;
  display: flex;
  gap: 10px;
}
.cont-02 .btn-area p{
  /* display: inline-block; */
  text-align: center;
  /* margin-right: 24px; */
}

#page-works .cont-02 .line01{
  margin: 0 auto;
  overflow: hidden;
  display: inline-block;
}
#page-works .cont-02 .line01 img{
  width: 80%;
}
@media screen and (max-width:768px){
  .cont-02 .line01{
    width: 120%;
    margin: 0 auto;
  }
  .cont-02 .img-area img {
    width: 100%;
  }
  .cont-02 .title-area-wrap01 , .cont-02 .title-area-wrap02 {
  width: 100%;
  }
  .cont-02 .title-area-01 h2 , .cont-02 .title-area-02 h2 {
  font-family: var(--font01);
  font-size: 1.8em;
  font-weight: 600;
  color: var(--white);
  margin-right: 0;
  margin-left: 0;
  text-align: center;
  }
 .cont-02 .title-area-01 , .cont-02 .title-area-02 {
  padding: 24px 0;
  width: 100vw;
  border-radius: 0;
  margin: 0 calc(50% - 50vw);
  margin-top: 100px;
  }
 .cont-02 .title-area-01 picture , .cont-02 .title-area-02 picture {
  left: 2%;
  top: -80px;
	}
  .cont-02 .cont-wrap .text-area {
  width: 100%;
  }
  .cont-02 .btn-area{
    display: block;
  }
  .cont-02 .btn-area p{
    font-size: 1.1em;
  }
}
 .btn03 , .btn04{
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 100vh;
  min-width: 190px;
  transition: opacity 0.2s;
  height: 50px;
  line-height: 1.1;
}
.btn03 {
  background-color: var(--green);
}
.btn04 {
  background-color: var(--brown);
}
.btn03 a , .btn04 a{
  display: block;
  color: var(--white);
  font-size: 1.1em;
  font-family: var(--font01);
  font-weight: 600;
  letter-spacing: 0.06em;
  /* padding: 16px 0; */
  width: 100%;
}
.btn03 a span , .btn04 a span{
  font-size: 0.8em;
}
.btn03:hover , .btn04:hover{
  opacity: 0.4;
  transition: opacity 0.6s;
}
.ro-reverse{
transform: scale(-1, 1);
}

@media screen and (max-width:768px){
  .btn03 , .btn04{
    width: 100%;
    padding: 16px 0;
    margin: 0;
    height: 70px;
  }
}


/* training */
#page-training section#cont-lead{
  display: inline-block;
}
.cont-03 p.lead-text{
  line-height: 1.5em;
  text-align: left;
  /* width: 80%; */
  margin: 0 auto 60px;
}
.cont-03 .title-area-03 {
  background-color: var(--green);
  padding: 8px 0;
  border-radius: 0 100vh 100vh 0;
  position: relative;
  margin-left: calc(50% - 50vw);
  padding-left: calc(50vw - 50%);
  margin-bottom: 30px;
}
.cont-03 .title-area-03::before {
  left:50%;
}
.cont-03 .title-area-03 h2 {
  font-family: var(--font01);
  font-size: 2.1em;
  font-weight: 600;
  color: var(--white);
  text-align: left;
  line-height: 1.4em;
}
.cont-03 h3 {
  color: var(--camel);
  /* font-family: var(--font01); */
  font-size: 1.4em;
  text-align: left;
  margin-bottom: 24px;
  position: relative;
  margin-bottom:64px;
}
.cont-03 .area1 {
  width: 50%;
  text-align: left;
  padding-right: 40px;
  line-height: 1.4em;
}
.cont-03 .area2 {
  display: block;
  width: 50%;
  text-align: left;
}
.cont-03 .text-box1{
  background-color: var(--white);
  padding: 30px;
  text-align: left;
  line-height: 1.4;
  margin-bottom: 20px;
}
.cont-03 .text-box2{
  display: grid;
  gap: 20px;
  grid-auto-flow: column;
}
.cont-03 .text-box2 img{
  width: 100%; 
}
.cont-03 .cont-boxwrap{
  text-align: left;
  display: grid;
  gap: 20px;
  grid-template-columns: repeat(3, 1fr);
}
.cont-03 .cont-box {
  background-color: var(--white);
  padding: 24px ;
  display: flex;
  flex-direction: column;
}
.cont-03 .cont-box ul , .cont-03 .cont-box p   {
  flex-grow: 1;
  margin-bottom: 30px;
}
.cont-03 .cont-box li {
  margin-bottom: 20px;
  text-indent: -1.4em;
  padding-left: 1.4em;
  line-height: 1.4em;
}
.cont-03 .cont-box li span{
  font-size: 0.8em;
  line-height: 1em;
}
.cont-03 .cont-box li::before{
  content: "●";
  color: var(--camel);
  padding: 0 4px 4px 0;
} 
.cont-03 h4{
  color: #DEB054;
  text-align: left;
  font-size: 1.3em;
  padding: 0.2em 0.5em;
  background: transparent;
  border-left: solid 7px var(--blue);
  margin-bottom:32px;
  line-height: 1.4;
  letter-spacing: 0.12em;
}
.cont-03 h4 span{
  font-size: 0.8em;
}
.cont-03 img{
  width: 100%;
}
.cont-03 p{
  margin-top: 10px;
}

@media screen and (max-width:768px){
.cont-03 .area1{
  width: 100%;
  /* margin-bottom: 40px; */
  text-align: left;
}
.cont-03 .area2{
  width: auto;
}
.cont-03 h3 {
    margin: 40px 0 0;
}
.cont-03 .title-area-03 {
  padding: 24px 0;
  width: 100vw;
  border-radius: 0;
  margin-left: calc(50% - 50vw);
  padding-left: calc(50vw - 50%);
  padding-right: calc(50vw - 50%);
}
.cont-03 .title-area-03 h2 {
  font-size: 1.7em;
  text-align: center;
}
.cont-03 .text-box1{
  margin-bottom: 40px;
}
.cont-03 .cont-boxwrap{
  text-align: left;
  display: grid;
  gap: 20px;
  grid-template-columns: repeat(1, 1fr);
}
.cont-03 p.lead-text{
  line-height: 1.5em;
  text-align: left;
  width: 100%;
  margin: 0 auto 60px;
}
.cont-03 .area1 {
  padding-right: 0;
}
.cont-03 .cont-box {
  padding: 10px;
}
}

/* benefits */
.cont-03 .cont-wrap {   /* 他ページでも利用 */
  margin-bottom: 60px;
}
#page-benefits .cont-03 .cont-wrap {
  margin-bottom: 100px;
}

.cont-03 .cont-wrap-1 {
  display: grid;
  gap: 20px;
  grid-template-columns: repeat(4, 1fr);
  text-align: left;
  margin-bottom: 120px;
}
.cont-03 .cont-wrap-1 .cont-box {
  background-color: var(--white);
  border: solid 1px var(--brown);
  cursor: pointer;
  text-align: center;
}
.cont-03 .cont-wrap-1 h2{
  color: var(--brown);
  font-size: 1.1em;
  font-weight: 500;
  line-height: 1.4em;
  margin-bottom: 40px;
  letter-spacing: 0.06em;
  height: 1.8em;
}
.cont-03 .cont-wrap-1 img{
  width: 60%;
  max-width: 100px;
  height: 110px;
  margin: 0 auto;
}
.cont-03 .cont-wrap-1 .cont-box:hover{
  background-color: var(--brown02);
  transition: .2s cubic-bezier(0.45, 0, 0.55, 1);
}
.cont-03 .title-area-04 {
  background-color: var(--green);
  padding: 8px 0;
  border-radius: 0 40px 40px 0;
  position: relative;
  margin-left: calc(50% - 50vw);
  padding-left: calc(50vw - 50%);
  padding-right: calc(50vw - 50%);
  margin-bottom: 64px;
}
.cont-03 .title-area-04 h2 {
  font-family: var(--font01);
  font-size: 2.1em;
  font-weight: 600;
  color: var(--white);
  text-align: left;
  line-height: 1.4em;
  position: relative;
  padding-left: 180px;
  width: 100vw;
}
.cont-03 .title-thum1 h2::before,.cont-03 .title-thum2 h2::before,.cont-03 .title-thum3 h2::before,.cont-03 .title-thum4 h2::before {
  position: absolute;
  width: 160px;
  top: -120%;
  left: 0;
}
.cont-03 .title-thum1 h2::before {
  content: url("../../asset/img/recruitment_rn/rm_benefits_img05.svg");
}
.cont-03 .title-thum2 h2::before {
  content: url("../../asset/img/recruitment_rn/rm_benefits_img06.svg");
}
.cont-03 .title-thum3 h2::before {
  content: url("../../asset/img/recruitment_rn/rm_benefits_img07.svg");
}
.cont-03 .title-thum4 h2::before {
  content: url("../../asset/img/recruitment_rn/rm_benefits_img08.svg");
}
.cont-03 .cont-wrap .area3 .text-title01{
  margin-bottom: 20px;
}
.cont-03 .cont-wrap .area1 ul{
  background-color: var(--white);
  padding: 20px;
  margin-top: 20px;
  font-weight: 600;
  /* font-family: var(--font01); */
}
.cont-03 .cont-wrap .area1 li{
  line-height: 1.6em;
  letter-spacing: 0.1em;
  font-size: 1.2em;
}
.cont-03 .cont-wrap .area3 {
  background-color: var(--white);
  padding: 40px;
  /* margin-top: 20px; */
  text-align: left;
}
.cont-03 .cont-wrap .area3 ol ,.cont-03 .cont-wrap .area3 ul{
  margin-bottom: 40px;
}
.cont-03 .cont-wrap .area3 li{
  line-height: 1.6em;
  letter-spacing: 0.1em;
}
hr{
  border-style: none;
  border-top: dotted 4px var(--blue);
  margin: 30px 0;
}
.cont-03 .area3 li , .cont-03 .area1 li {
  margin-bottom: 8px;
  text-indent: -1.4em;
  padding-left: 1.4em;
  line-height: 1.4em;
}
.cont-03 .area3 ul li::before , .cont-03 .area1 li::before{
  content: "●";
  color: var(--camel);
  padding: 0 4px 4px 0;
} 

@media screen and (max-width:768px){
  #page-benefits #cont-lead h2{
  font-size: 1.4em;
  letter-spacing: 0.03em;
}
  .cont-03 .cont-wrap-1 {
  display: grid;
  gap: 20px;
  grid-template-columns: repeat(2, 2fr);
  text-align: left;
    /* display: flex;
    justify-content: space-around; */
}
.cont-03 .title-area-04 {
  padding: 24px 0;
  width: 100vw;
  border-radius: 0;
  margin-left: calc(50% - 50vw);
  padding-left: calc(50vw - 50%);
  padding-right: calc(50vw - 50%);
}
.cont-03 .title-area-04 h2 {
  font-size: 1.7em;
  text-align: left;
  padding-left: 100px;
}
.cont-03 .title-area-04 h2::before {
  width: 20%;
  max-width: 76px;
  top: 50%;
  transform: translateY(-45%);
}
.cont-03 .cont-wrap-1 img{
  height: 90px;
}
.cont-03 .title-area-04 h2 {
  font-family: var(--font01);
  font-size: 1.8em;
  font-weight: 600;
  color: var(--white);
  text-align: left;
  line-height: 1.4em;
  position: relative;
  /* padding-left: 180px; */
  width: 100%;
}
}

/* インタビュー */
#page-interview .cont-03{
  text-align: left;
}
#page-interview .cont-03 .title-area-03 h2 {
  font-size: 1.6em;
  letter-spacing: 0.06em;
}
.cont-03 .area5 {
  width: 60%;
  /* margin-bottom: 40px; */
}
.cont-03 .area6 {
  display: block;
  width: 40%;
  text-align: right;
}
#page-interview .area6 img , #page-interview .area1 img {
  width: 85%;
}
#page-interview .cont-wrap{
  margin:40px 0 60px;
}
#page-interview .cont-03 .area2 p {
  margin-bottom: 40px;
}
#page-interview .cont-03 .area5 p{
  margin-bottom: 40px;
}
#page-interview .area6{
  text-align: center;
  font-weight: 700;
}
#page-interview .sub-text{
  font-size: 1.1em;
  font-weight: 600;
  line-height: 1.4;
}
#page-interview .text-area span{
  font-size: 0.9em;
}
#page-interview .cont-03 img{
  border-radius: 16px;
  margin-bottom: 20px;
}
@media screen and (max-width:768px){
  .cont-03 .area5 {
    width: 100%;
  }
  #page-interview .area6 ,   #page-interview .area1 {
    width: 100%;
    text-align: center;
  }
  #page-interview .area6 img , #page-interview .area1 img {
  width: 85%;
}
  #page-interview .area1 {
    order: 2;
  }
  #page-interview .area2 {
  order: 1;
  }
  #page-interview .cont-03 .area2 p , #page-interview .cont-03 .area5 p{
  margin-bottom: 40px;
}
}



/* タイムスケジュール */

.time-schedule {
  list-style: none;
  /* margin: 0 auto 0 6em; */
  padding-left: 100px;
  box-sizing: border-box;
  position: relative;
  z-index: 0;
  margin-top: 60px;
}
.time-schedule::before {
  content: "";
  background: var(--camel);
  width: 20px;
  height: 100%;
  position: absolute;
  left: -20px;
  border-radius: 100vh;
  z-index: -1;
}
.time-schedule li {
  width: 100%;
  margin-top: 20px;
  padding: 5px 0;
  position: relative;
}
.time-schedule span.time {
  font-family: var(--font01);
  font-size: 1.4em;
  font-weight: 700;
  width: 5em;
  display: inline-block;
  margin-left: -5em;
  vertical-align: top;
  text-align: right;
  box-sizing: border-box;
  position: absolute;
  left: 0;
  top: 6%;
}
.time-schedule li::before  {
  content: "";
  position: absolute;
  left: -123px;
  top: 10%;
  background: var(--brown);
  width: 26px;
  height: 26px;
  border-radius: 50%;
}
.time-schedule .sch_box{
  margin-left: 30px;

}
.time-schedule .text_box {
  display: inline-block;
  width: 70%;
  vertical-align: middle;
  box-sizing: border-box;
  text-align: left;
  padding-right: 60px;
  border-bottom: dotted 2px var(--brown) ;
}
.time-schedule .img_box {
  width: 30%;
}
.time-schedule .sch_title {
  font-size: 16px;
  font-weight: 700;
}
.time-schedule .sch_tx {
  font-weight: normal;
  padding-bottom: 30px;
}

@media screen and (max-width:768px){
  .time-schedule {
    margin: 0 auto 0 2em;
    padding-left: 0;
  }
  .time-schedule li::before{
    top: 4%;
    left: -23px;
   }
  .time-schedule span.time{
    margin-left: 0;
    top: 2%;
    font-size: 1.8em;
    letter-spacing: 0.15em;
    left: 28px;
    text-align: left;
  }
  .time-schedule .text_box {
  width: 100%;
  padding-right: 0;
  padding-top: 60px;
  border-bottom: 0;
}
.time-schedule .img_box {
  width: 100%;
  margin: 40px 0 20px;
  padding-bottom: 40px;
  padding-right: 10px;
  border-bottom: dotted 2px var(--brown) ;
}
}

/* インタビュー内テーブル */
table{
  margin-bottom: 60px;
}
tr{
  border: solid 1px var(--brown);
}
th{
  width: 30%;
  line-height: 1.6;
  padding: 16px;
  vertical-align: middle;
  background-color: #f1edc8;
  text-align: center;
  font-size: 1.2em;
}
td{
  width: 70%;
  line-height: 1.6;
  padding: 16px;
}
th span{
  display: inline-block;
  font-size: 0.8em;
  line-height: 1.35;
}
@media screen and (max-width:768px){
  th , td{
    width: 100%;
    display: block;
  }
}

/* 募集要項 */

#page-job .cont-03 .title-area-03{
  background-color: var(--camel);
}
#page-job .joblist{
  margin-bottom: 60px;
}
#page-job .joblist .navi-box {
  background-color: var(--white);
  text-align: center;
  font-size: 1em;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  line-height: 1.2;
  height: 70px;
}
#page-job .joblist li.navi-box a{
  display: block;
  color: var(--brown);
  padding: 0;
  width: 100%;
  font-size: 1.1em;
}
#page-job .job-1 .navi-box {
  border: solid 1px var(--brown);
}
#page-job .job-2 .navi-box {  
  border: solid 1px #b6771a;
}
#page-job .job-1 li.navi-box a{
  color: var(--brown);
}
#page-job .job-2 li.navi-box a{
  color: #b6771a;
}
#page-job .joblist li.navi-box:hover{
  opacity: 0.4;
  transition: opacity 0.4s;
}
#page-job .joblist li.navi-box .arrow:after {
  border-color: transparent transparent transparent var(--brown);
}
@media screen and (max-width:768px){
  #page-job .joblist li.navi-box a{
    font-size: 1em;
  }
}
#entry{
  display: inline-block;
  text-align: center;
  margin: 0 auto;
}
#entry p{
  font-size: 1.1em;
}
#entry .btn01{
  width: 16em;
  height: 80px;
  font-size: 2em;
  font-weight: 500;
  letter-spacing: 0.2em;
}
@media screen and (max-width:768px){
  #entry{
  display: block;
  }
  #entry .btn01{
    width: 100%;
  }
}