@charset "utf-8";
body { width: 100%; overflow-x:hidden; }
img { max-width: 100%; height: auto; }
.mt3em { margin-top: 3em; }
.mt2em { margin-top: 2em; }
.mt1em { margin-top: 1em; }

.bg-yellow { background: rgba(255,255,26, .05); }

.t-black { color: #222; }
.t-pink { color: #eb91aa; }
.t-orange { color: #ea745b; }
.t-green { color: #76c172; }
.t-blue { color: #66bcbf; }
.t-bold { font-weight: bold; }
.t-marker { font-weight: bold; background: linear-gradient(180deg, transparent .5em, #f9ff8f .5em); lien-he
1.5; }
.t-center { text-align: center; }
.t-right { text-align: right; }
.t-sub { font-size: .9375rem; }

.sp-only { display: none; }
@media screen and (max-width: 750px) {
  .sp-only  { display: initial; }
  .pc-only { display: none; }
}

.breadcrumb-wrap  { padding: 1em;  }
.breadcrumb { display: flex; align-items: center; font-size: 1rem; font-size: .75rem; overflow: hidden; }
.breadcrumb > li { flex-shrink: 0; }
.breadcrumb > li + li::before { content: ''; width: .4em; height: .4em; display: inline-block; border-top: 1px solid; border-right: 1px solid; margin: 0 .5em; transform: rotate(45deg); vertical-align: middle; }
.breadcrumb > li a { text-decoration: underline; }
.breadcrumb img { display: block; width: auto; height: 1.2em; vertical-align: middle; margin-right: .5em; }


@media screen and (min-width: 751px) {
  .breadcrumb-wrap { padding-left: 0; padding-right: 0; }
}

.experience-text { text-align: center; font-size: min(25px, 3.3vw);  margin: 0 auto; border-top: 2px dotted #cab7ad; border-bottom: 2px dotted #cab7ad; padding: .7em 0; width: 80%; }

/*home*/

.home-fv-ribbon { background: #5dcc57; color: #FFF; text-align: center; font-size: min(25px, 3.2vw); font-weight: bold; }
.home-fv-ribbon .t-yellow { color: #FAFB68; font-size: 1.15em; }

.home-mv { position: relative; background: url("../img/home/bg-fv.jpg") center center / 250px auto; padding-bottom: min(80px, 10vw); }
.home-mv .img { width: 100%; height: 115vw; object-fit: cover; object-position: right top; }
.home-mv .title { width: 100%; position: relative; z-index: 2; margin: -50vw auto 0; }
.home-mv .subcopy { position: absolute; width: 14vw; height: auto; top: 1rem; right: 5%; margin: auto; }
.home-mv .sns { position: absolute; left: 5%; top: 1rem; width: 30vw; }

@media screen and (min-width: 751px) {
  .home-mv { position: relative;  background-position: center center; background-size: 100% auto;  height: 65vw; overflow: hidden; padding-bottom: 0; }
  .home-mv .img {  margin:0 0 0 auto; display: block; width: 100%; height: 110%; 
   -webkit-mask-image: linear-gradient(70deg, transparent 10%, black 40%); 
         mask-image: linear-gradient(70deg, transparent 10%, black 40% );
  
  }
  .home-mv .title {  position: absolute; width: 55vw; margin: auto; top: -3vw; left: auto; right: 45vw; max-width: 700px; }
  .home-mv .subcopy { width: 10vw; top: 3vw;  }
  .home-mv .sns { width: 12vw; left: 47vw; top: 2vw;  }
  .home-mv .apply { width: 50vw; top: 35vw; left: auto; right: 47vw;  position: absolute; }
  .home-mv .line-experience-block { padding-bottom: .5em; }
  .home-mv .experience-text { font-size: 1.5vw; width: 20em;  }
}

@media screen and (min-width: 1000px) {
  .home-mv { height: 60vw; max-height: 750px; }
  .home-mv .img { object-fit: contain; margin:  0 auto; object-position: center center; height: 110%; 
   -webkit-mask-image: linear-gradient(to right, transparent 10%, black 40%, black 90%, transparent 100%);  -webkit-mask-size: 1200px 100%; -webkit-mask-position: center center; 
         mask-image: linear-gradient(to right, transparent 10%, black 40% ,  black 90%, transparent 100%); mask-size: 1200px 100%; mask-position: center center; }
  .home-mv .title { top: -50px; }
  .home-mv .subcopy { width: 100px; top: 2rem; right: auto; left: 84vw; }
  .home-mv .sns { width: 120px;   }
  .home-mv .apply { width: min(600px, 50vw); top: min(32vw, 430px); } 
  .home-mv .experience-text { font-size: min(20px, 2vw);  }
  
}
@media screen and (min-width: 1500px) {
  .home-mv .subcopy {  left: calc(50vw + 480px); }
  .home-mv .sns { left: 49vw; }
}

.home-ueno { padding: min(70px, 9vw) 0 min(30px, 4vw); }
.home-ueno .title { width: 100%; }
.home-ueno .text { width: 90%; margin: 2em auto 4em; font-size: min(20px, 2.6vw); line-height: 2; }

.home-limited { background-image:  url("../img/home/bg-limit-t.png"), url("../img/home/bg-limited-b.png"),linear-gradient(to bottom, #fbc5a1, #fcd29e, #d6ddac); background-position: center top, center bottom, center center; padding: 10vw 0; background-repeat: no-repeat; background-size: 100% auto, 100% auto, 100% calc(100% - 4px); }
.home-limited .title { margin-top: min(80px, 10vw); }
.home-limited .text { width: 84%; margin: 2em auto 4em; font-size: min(20px, 2.6vw); line-height: 2; }
.home-limited .text p + p { margin-top: 1.4em; }

@media screen and (min-width: 751px) {
  .home-limited { background-size: 100% 10vw, 100% 10vw, 100% calc(100% - 4px); }
}

.home-why .text { width: 88%; margin: 0 auto; line-height: 2.5; background: url("../img/home/dot-line.svg") repeat-y left 1em / 100% 2.5em; font-size: min(25px, 3.3vw); }

.home-why .average { background: linear-gradient(-30deg, #f9d5cd, #f1ecce, #ddecd4); padding: min(130px, 15vw) 0; clip-path: polygon(0  min(100px, 12vw), 100% 0, 100% calc(100% -  min(100px, 12vw)), 0 100%); margin: min(30px, 4vw) 0; }

.home-time .text { font-size: min(33px, 4.4vw); text-align: center; margin: 1em auto;}
.home-time .sub { font-size: min(25px, 3.3vw); margin-top: 1em; }



.home-reward .title { margin-bottom: 2em; padding-top: min(80px,10vw); }
.home-reward .text { width: 84%; margin: 2em auto 4em; font-size: min(25px, 3.3vw); line-height: 2; }
.home-reward .text p + p { margin-top: 1.4em; }

.home-office { background: #fff0ec; padding: min(55px, 7.3vw) 0 min(50px, 6vw); }
.home-office .title {margin-bottom: 1em; }
.home-office .text { width: 84%; margin: 2em auto 0; font-size: min(25px, 3.3vw); line-height: 2; }


.home-reason { padding: min(80px, 10vw) 0;}
.home-reason .text { background-image: url("../img/home/bg-reason-t.png"), url("../img/home/bg-reason-b.png"), linear-gradient(to bottom, #d7e7c7, #fbedc8, #fbd4be); background-repeat: no-repeat; background-position: center top, center bottom, center 17vw; background-size: 100% auto, 100% auto, 100% calc(100% - 28vw); margin-top: -18vw; position: relative; z-index: 2; padding: min(100px, 15vw) 0; }
.list-reason-point { width: 75%; margin: 0 auto; }
.list-reason-point > li { text-align: center; }
.list-reason-point > li + li { margin-top: 3em; }
.list-reason-point .ttl { font-size: min(40px, 5.4vw); margin: .5em 0; line-height: 1.3; color: #ea745b; font-weight: bold; }
.list-reason-point p { font-size: min(20px, 2.6vw);}


.home-work { padding: min(80px, 10vw) 0; background: url("../img/home/bg-dot-green.jpg"); }
.home-work .text { width: 84%; margin: 2em auto 0; font-size: min(25px, 3.3vw); line-height: 2; }
.home-work .text p + p { margin-top: 1.5em; }


.home-popular { padding: min(80px, 10vw) 0; }
.list-popular { width: 86%; margin: 0 auto; margin-top: max(-10vw, -80px); }
.list-popular > li { background: url("../img/home/bg-point.png") no-repeat center center / 100% auto; position: relative; height: min(470px, 63vw);  padding-top: min(90px, 12vw); }
.list-popular > li + li { margin-top: 3em; }
.list-popular .num { width: 20%; position: absolute; top: 0; left: 0; right: 0; margin: auto; transform: translateY(-20%); }
.list-popular .ttl { text-align: center; color: #eb7e68; font-size: min(45px, 6vw); margin: 0 0 .2em; font-weight: bold; line-height: 1.3; }
.list-popular .text { width: 80%; margin: 0 auto; line-height: 1.5; font-size: min(25px, 3.3vw); }


/*company*/
.company-outline .title img { display: block; margin: 0 auto 1rem; width: 25vw; }
.company-outline .lead { text-align: center; font-size: .91rem; dis}
.outline-img { width: 100%; margin: 1.6rem 0; display: block; }
@media screen and (min-width: 751px) {
  .company-outline .title img { width: 170px; margin: 0 auto 2rem; }
  .company-outline .lead { font-size: .835rem; }
  .outline-img { width: 450px; margin: 2.5rem auto; }
}




.home-flow { padding: 3rem 0 3rem; }
.home-flow .head .title img { width: 100%; display: block; margin: 0 auto 2rem; }
.home-interview-flow-list .img {  widows: 100%;  display: block; margin: 0 auto; }
.home-interview-flow-list .first-text { text-align: left;}
.home-interview-flow-list .text { text-align: center; margin-top: .5em; font-weight: bold; }
.home-interview-flow-list .text .note { font-weight: normal;font-size: .75em; }
.home-interview-flow-list > li::before { content: ''; width: 100%; height: 13vw; background: url("../img/home/arrow.png") no-repeat center center / 10vw auto; display: block; }
.home-interview-flow-list > li:first-child::before {display: none; }



/*faq*/
.title-faq { margin: 2rem 0 1rem; text-align: center; }
.title-faq img { width: 100%; }
.qa-list { width: 88%; margin: 0 auto; }
.qa-list .question { font-size: min(30px, 4vw); color: #6fb85c;  font-weight: bold; line-height: 1.3;  background: url("../img/home/icon-q.png") no-repeat .7em top / min(6.6vw, 50px) auto; padding: .2em 0 .7em 3em; }
.qa-list .answer { font-size: min(20px, 2.6vw); background: #ebf4e3 url("../img/home/icon-a.png") no-repeat 1.05em 1em / min(6.6vw, 50px) auto; border-radius: .5rem; padding: 1rem 1.5em 1.5em 4.5em; margin-bottom: 2rem;  }
.qa-list .answer p + p { margin-top: 1em; }

.home-faq .qa-list .question:nth-of-type(n + 6),
.home-faq .qa-list .answer:nth-of-type(n + 6) { display: none; }

.home-id { background: #fff0ec; padding: min(80px, 10vw) 0; }
.home-id .text { width: 80%; margin: 1em auto; font-size: min(35px, 3.3vw); }
.home-id .text p + p { margin-top: 1.5em; }

.page-blog-archive { background: #f5f9e9 url("../img/common/bg-green-dot.jpg"); padding: min(10vw, 60px) 0 0; }

@media screen and (min-width: 751px) {
  .page-blog-archive { background-size: 750px auto; }
  
}
.blog-categories { padding: 3rem 0 4rem; }
.blog-categories .title img { display: block; width: 30vw; margin: 0 auto 1rem; }

.list-blog-categories { display: flex; flex-wrap: wrap; width: 94%; margin: 0 auto; }
.list-blog-categories > li { flex-grow: 1; text-align: center; }
.list-blog-categories a { display: block; padding: 1em 1.5rem; border: 1px solid; border-radius: 2em; margin: 3px; font-size: .83rem;  }

@media screen and (min-width: 751px) {
  .blog-categories { padding: 70px 0; }
  .blog-categories .title img { max-width: 140px; margin-bottom: 2rem; }
  .list-blog-categories { max-width: 1000px;justify-content: center;  }
  .list-blog-categories > li { flex-grow: 0; }
}

.blog-archive-head { text-align: center; }
.blog-archive-head img { width: 83vw; max-width: 420px; margin: 0 auto;  }
.parts-blog-archive { background: url(../img/common/bg-green-dot.jpg); padding: 5rem 0 3.5rem; }
.parts-blog-archive .inner { width: 94%;  max-width: 850px; margin: 0 auto; }
.parts-blog-archive.blog-title { width: 83vw; margin: 0 auto; display: block; }

.blog-list { margin: 2.5rem 0; display: grid; grid-template-columns: repeat(2, 1fr); gap: 1rem; }
.blog-list-item { background: #FFF; padding: 1.6rem 1.3rem; border-radius: .7rem; box-shadow: 5px 5px 11px 0 rgba(211,221,176, .34); }


.blog-list.page { margin-top: 2rem; }

.blog-list-item .title { line-height: 1.5; }

.blog-list-item img { width: 100%; aspect-ratio: 3/ 2; object-fit: cover; margin-bottom: 1em;  }
.blog-list-item .time { font-size: .75rem; }
.parts-blog-archive-more { width: 88vw; display: block; margin: 0 auto; }

@media screen and (min-width: 751px) {
  .parts-blog-archive { background-size: 750px auto; }
  
  .parts-blog-archive .blog-list.parts { display: grid; grid-template-columns: repeat(2, 1fr); gap: .875rem; }
  .parts-blog-archive .blog-list.parts > li { padding: 1.2rem; }
  
  .parts-blog-archive .blog-list.parts > li + li {margin: 0; }
  .parts-blog-archive-more { max-width: 465px; }
  
  .blog-list-item.parts .title { font-size: .835rem; }
  
}


.blog-head { width: 94%; margin: 0 auto; padding: 0 0 1rem;  }
.blog-head .title { font-size: 1.6rem; font-weight: bold; line-height: 1.5; }
.blog-head .date { font-size: .75rem; }

@media screen and (min-width: 751px) {
  .blog-head .post-categories { font-size: 1rem; }
  .blog-head .post-categories a { padding: .2em .5em; }
}
.blog-body { margin: 0 auto; font-size: 1.125rem;  }
.blog-body > * { width: 94%; margin: 0 auto; }
.blog-body h1,
.blog-body h4 { font-size: 1.8rem; color: #FFF;  padding: .5em; position: relative; z-index: 2; font-weight: bold; margin-bottom: .5em; line-height: 1.5; background: #ea745b; width: 100%; }
.blog-body h2,
.blog-body h5{ font-size: 1.6rem; font-weight: bold; border-top: 2px solid #62544d; border-bottom: 2px solid #62544d; padding: .2em .5em; margin-bottom: .5em; color: #ea745b;  }
.blog-body p { margin-top: 1em; margin-bottom: 1em; }
.blog-body img { display: block; margin: 1em auto; }
.blog-body ul { padding: 0; }
.blog-body ul > li { padding-left: 1em; }
.blog-body ul > li::before { content: '・'; width: 1em; margin-left: -1em; display: inline-block;  }

.blog-body .frame {  margin: 2em auto; }
.blog-body .frame .title { max-width: calc(100% - 2em); color: #FFF; margin: 0 1em; width: fit-content; padding: .2em 1em; font-weight: bold; border-radius: 5px 5px 0 0; font-size: 1.2rem; background: #8a7c75; }
.blog-body .frame .conts { border-width: 3px; border-style: solid; border-radius: 5px; padding: 1.5em 1rem; font-size: 1.2rem; font-weight: bold; line-height: 1.5; border-color: #8a7c75; }


.blog-body .box-block { border: 2px solid; padding: .5em 1em;  border-radius: 10px; }

.blog-body .frame .title.point::before,
.blog-body .frame .title.document::before { content: ''; width: 1.2em; height: 1.2em; display: inline-block; background-size: contain; marign-right: .5em; vertical-align: middle; background-repeat: no-repeat; background-position: center center; }
.blog-body .frame .title.point::before { background-image: url(../img/blog/icon-point.svg); }
.blog-body .frame .title.document::before { background-image: url(../img/blog/icon-document.svg); }
@media screen and (min-width: 751px) {
  .blog-body { max-width: 94%; font-size: 1rem; padding-bottom: 5rem; }
  .blog-body > * { width: 100%; }
  .blog-body h1,
  .blog-body h4 { font-size: 1.5rem; }
  .blog-body h2,
  .blog-body h5 { font-size: 1.25rem; padding: .3em 1em; }
  
  .blog-body > p { padding: 0 1em; }
  
  .blog-body .frame .title { font-size: 1.1rem; }
  .blog-body .frame .conts { font-size: 1.1rem; }
  
}

.related-post { background: #f5f9ea; padding: 2.5rem 0; max-width: 750px; margin: 0 auto; }
.related-post .block-title { margin-bottom: 1em; font-weight: bold; font-size: 1.5rem;padding-left: 1em; text-indent: -1em;  }
.related-post .inner { width: 94%; margin: 0 auto; }


@media screen and (min-width: 751px) {
  .related-post  { margin-bottom: 90px; border-radius: 10px; }
  .related-post .block-title {font-size: 1.25rem; }
  .related-post .blog-list { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.25rem; }
  .related-post .blog-list > li + li { margin: 0; }
  .related-post .blog-list-item { flex-direction: column; justify-content: flex-start; }
   .related-post .blog-list-item .img { width: 100%; }
  .related-post .blog-list-item .text { width: 100%; margin-top: 1em; }
  .related-post .blog-list-item .title { font-size: .85rem; }
}



.post-toc { width: 94%; margin: 0 auto; background: #f3ece9; counter-reset: listnum; margin-bottom: 3rem;  }
.post-toc .title { color: #FFF; background: #776b66; padding: .2em .8em; font-weight: bold; font-size: 1.6rem; display: flex; align-items: center; justify-content: center; }
.post-toc .close { width: 5em; background: #FFF; margin-left: .5em; border-radius: 3px; text-align: center; color: #776b66; font-size: 1rem; border: none; display: inline-block; cursor: pointer; }
.post-toc .inner { padding: .5em 1.5em 1em; }
.post-toc a { display: block; }
.post-toc .main { counter-increment: listnum; font-size: 1.25rem; font-weight: bold; margin: .5em 0;  }
.post-toc .main::before { content: counter(listnum); width: 1.2em; height: 1.2em; background: #d7b3a4; margin-right: .8em; border-radius: 50%; line-height: 1.2; text-align: center; color: #FFF; display: inline-block; fotn-weight: bold;  } 
.post-toc .sub { padding-left: 2em; }
.post-toc .sub::before { content: ''; width: 0; hegiht: 0; border-style: solid; border-width: .3em; marign-right: .8em; border-color: transparent transparent transparent #d7b3a4; display: inline-block; }

@media screen and (min-width: 751px) {
  .post-toc { width: 100%; }
  .post-toc .title { padding-left: 4rem; padding-right: 4rem; font-size: 1.25rem; }
  
  .post-toc .close { font-size: .9rem; }
  
  .post-toc .inner { padding-left: 4rem; padding-right: 4rem; }
  .post-toc .main { font-size: 1rem; }
  .post-toc .sub { font-size: .9rem; }
  
}

.post-categories { display: flex; flex-wrap: wrap; line-height: 1.2; margin-bottom: .5rem;  }
.post-categories > li { margin-right: .2rem; margin-bottom: .2rem; }
.post-categories a { display: block; padding: 0 .5em; border-radius: .2rem; color: #FFF; background: #a1c326; letter-spacing: 0;  }

@media screen and (min-width: 751px) {
  .post-categories { font-size: .8rem; }
}


.pagination  { padding: 2rem 0 3rem; text-align: center; }
.wp-pagenavi { display: flex; align-items: center; justify-content: center; }
.pagination .page,
.pagination .current,
.pagination .previouspostslink,
.pagination .nextpostslink{ font-size: 1.25rem; width: 3em; height: 3em; display: inline-block; color: #a1c326;line-height: 3; text-align: center; border-radius: 50%; font-family:'Zen Maru Gothic', serif; font-weight: bold;  }
.pagination .current { color: #FFF; background: #bad360; }
.pagination .previouspostslink,
.pagination .nextpostslink { color: #FFF; background: #a1c326; }
.pagination .extend { margin: 0 .5em; }
@media screen and (min-width: 751px) {
  .pagination { padding: 55px 0 110px; }
}


.line-apply-block { background: #f9ff8f; padding:1.8rem 0 2rem; text-align: center; }
.line-apply-block .msg { width: 62%; margin: 0 auto 1rem; }
.line-apply-block .btn { width: 93%; }

@media screen and (min-width: 751px) {
  .line-apply-block .msg { max-width: 310px; }
  .line-apply-block .btn { max-width: 470px; }
}

.line-experience-block {  padding:1.8rem 0 2rem; text-align: center; }
.line-experience-block .msg { width: 78vw; margin: 0 auto 1rem;}
.line-experience-block .btn { width: 93%; max-width: 470px; }