@charset "utf-8";
/* CSS Document */

/* -------------------------
/* Created date: --
/* Created user: --
/* Last up date: 2022.09.14
/* Last up date user: yamaguchi
/* for sp and pc
--------------------------*/
/* ======== newschool voice start ================*/
:root{
  --svgMokumokuShita: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 399 92"><path fill="rgba(255,255,255,1)" fill-rule="evenodd" d="M43.978,23.395 C51.9,18.759 76.729,15.918 78.381,42.137 C90.89,34.722 108.524,36.497 115.266,53.453 C124.531,31.773 150.378,43.552 150.378,43.552 C149.226,22.662 186.525,10.659 198.968,35.64 C216.988,21.920 233.526,38.632 234.789,49.210 C234.789,49.210 245.850,43.411 252.522,53.807 C261.459,28.305 291.879,31.981 300.48,38.954 C299.959,13.80 330.578,11.636 340.125,25.163 C345.372,15.410 361.34,14.376 367.79,20.919 C377.453,3.200 394.566,0.416 398.999,0.55 C398.999,30.700 398.999,61.354 398.999,91.999 C266.13,91.999 132.986,91.999 0.0,91.999 C0.0,61.354 0.0,30.700 0.0,0.55 C29.43,-1.93 39.643,16.616 43.978,23.395 Z" /></svg>') center top / auto 100px repeat-x;
}

/* Bottom Block --------------------------- */
.scJobInner {
  position: relative;
  margin: 0 auto;
  background: var(--svgMokumokuShita), repeating-linear-gradient(-45deg, rgba(255, 255, 255, 0.3) 0 2px, rgba(255, 255, 255, 0) 3px 6px), #c8f1ed;
  background-position: center 60px, center;
}

.scJobInner::before {
  content: '';
  top: 120px;
  left: 0;
  width: 100%;
  height: calc(100% - 120px);
  background: linear-gradient(to bottom, #fff 0, rgba(255, 255, 255, 0.5) 100px,
   rgba(255, 255, 255, 0.5) calc(100% - 100px), #fff 100%), 
   radial-gradient(#ace5e0 0, #fff 2px) left top / 5px 5px repeat;
}

.scJobInner .anshin {
  margin: 0 auto 15px;
  padding: 30px 5px;
  max-width: var(--contentsWidth);
  text-align: center;
  font-size: 2.6rem;
  font-weight: bold;
}

.scJob .scJobInner .emp::before {
  background: rgb(var(--naviEmerald));
}

.scJobInner ul {
  position: relative;
  display: grid;
  grid-template-columns: 100%;
  gap: var(--paddingMid);
  margin: 0 auto;
  padding: 0 var(--paddingMinMin) var(--paddingMax);
  max-width: var(--contentsWidth);
}

.scJobInner .inner {
  position: relative;
  display: grid;
  justify-content: center;
  gap: var(--paddingMinMin);
  margin: 0 auto var(--paddingMin);
  padding: var(--paddingMinMin);
  background: #fff;
  border: solid 3px #c8f1ed;
  --mainColor: rgb(var(--naviEmerald));
}

.scJobInner .inner::before,
.scJobInner .inner::after {
  content: '';
  width: 80px;
  height: 60px;
  border-width: 5px;
  border-color: var(--mainColor);
}

.scJobInner .inner::before {
  top: -4px;
  right: -4px;
  border-top-style: solid;
  border-right-style: solid;
}

.scJobInner .inner::after {
  bottom: -4px;
  left: -4px;
  border-bottom-style: solid;
  border-left-style: solid;
}

.scJobInner .numTxt{
  position: relative;
  margin-bottom: 5px;
  padding: 2px 5px;
  width: fit-content;
  background:  rgb(var(--naviBlue));
  font-size: 1.4rem;
  line-height: 1.2;
  font-weight: bold;
  color: #fff;
}

.scJobInner .numTxt span{
  font-size: 120%;
}

.scJobInner .itemThmb {
  position: relative;
  z-index: 1;
  display: grid;
  justify-content: center;
  gap: var(--paddingMinMin);
  width: 100%;
}

.scJobInner .itemThmb h3 {
  position: relative;
  width: fit-content;
  font-size: 2rem;
  line-height: 1.4;
  text-align: left;
  color: rgb(var(--naviEmerald));
}

.scJobInner .itemThmb figure {
  position: relative;
  z-index: 1;
  margin: 0 auto;
  width: 100%;
  max-width: var(--imageMaxWidth);
  overflow: hidden;
  border-radius: 1rem;
}

.scJobInner .itemThmb figure img {
  width: 100%;
  object-fit: contain;
}

.scJobInner .yerrowLink {
  position: relative;
  padding: 0 10px 0 0;
  width: 100%;
  font-size: 1.4rem;
  text-align: right;
  font-weight: bold;
}

.scJobInner .yerrowLink span {
  display: inline-block;
  padding: 2px 3px;
  background: linear-gradient(to top, rgb(var(--naviCream)) 0px, rgb(var(--naviCream)) 7px, rgba(255, 255, 255, 0) 7px) center bottom / 100% no-repeat;
}

.scJobInner .yerrowLink::after {
  content: '';
  top: 50%;
  right: 0;
  width: 0.5em;
  height: 0.5em;
  border-bottom: solid 1px #333;
  border-right: solid 1px #333;
  transform: translate(0, -50%) rotate(-45deg);
}


@media screen and (min-width: 768px) {

  /* -------------------------
  /* for pc
  --------------------------*/
  .scJobInner {
    padding: 60px 0 0;
    background-position: center 100px, center;
  }

  .scJobInner::before {
    top: 160px;
    height: calc(100% - 160px);
  }

  .scJobInner .inner::before,
  .scJobInner .inner::after {
    width: 200px;
    height: 100px;
  }

  .scJobInner .itemThmb {
    display: flex;
    gap: var(--paddingMinMin);
    justify-content: center;
    align-items: center;
    padding-bottom: var(--paddingMinMin);
    border-bottom: solid 2px rgb(var(--naviGray));
  }

  .scJobInner .numTxt{
    margin: 0 auto 15px;
    padding: 2px 15px;
    font-size: 1.2rem;
    text-align: center;
  }

  .scJobInner .itemThmb h3{
    margin: 0 auto;
    text-align: center;
    font-size: 2.4rem;
  }
}