/* =========================================================
   RECRUIT DETAIL
   求人詳細ページ共通
========================================================= */


/* =========================================================
   VARIABLES
========================================================= */

.rd-page {

  --rd-green: #3f5246;
  --rd-green-dark: #314137;

  --rd-text: #303732;
  --rd-muted: #737a75;

  --rd-bg: #f7f7f3;
  --rd-bg-soft: #efefe9;
  --rd-white: #ffffff;

  --rd-line: rgba(63, 82, 70, .17);

  --rd-serif:
    "Noto Serif JP",
    "Yu Mincho",
    "YuMincho",
    serif;

  --rd-sans:
    -apple-system,
    BlinkMacSystemFont,
    "Helvetica Neue",
    "Noto Sans JP",
    Arial,
    sans-serif;

  color: var(--rd-text);

  background: var(--rd-bg);

  font-family: var(--rd-sans);

  overflow: hidden;

}


/* =========================================================
   COMMON
========================================================= */

.rd-page *,
.rd-page *::before,
.rd-page *::after {

  box-sizing: border-box;

}


.rd-inner {

  width: min(
    calc(100% - 80px),
    1180px
  );

  margin-inline: auto;

}


.rd-eyebrow {

  margin: 0 0 25px;

  font-size: 13px;

  line-height: 1.6;

  letter-spacing: .16em;

  color: var(--rd-green);

}


.rd-section-head {

  margin-bottom: 72px;

}


.rd-section-head h2 {

  margin: 0;

  font-family: var(--rd-serif);

  font-size: clamp(
    34px,
    4vw,
    56px
  );

  font-weight: 300;

  line-height: 1.45;

  letter-spacing: .04em;

  color: var(--rd-green-dark);

}


/* =========================================================
   REVEAL
========================================================= */

.rd-reveal {

  opacity: 0;

  transform:
    translate3d(
      0,
      38px,
      0
    );

  transition:
    opacity 1s ease,
    transform 1.1s
      cubic-bezier(
        .22,
        1,
        .36,
        1
      );

}


.rd-reveal.is-visible {

  opacity: 1;

  transform:
    translate3d(
      0,
      0,
      0
    );

}


/* =========================================================
   HERO
========================================================= */

.rd-hero {

  position: relative;

  min-height: 76vh;

  display: flex;

  align-items: center;

  padding:
    170px 0
    120px;

  background:
    #e7e9e3;

}


.rd-hero::before {

  content: "";

  position: absolute;

  width: 540px;
  height: 540px;

  right: -130px;
  top: -120px;

  border-radius: 50%;

  border:
    1px solid
    rgba(
      63,
      82,
      70,
      .12
    );

}


.rd-hero::after {

  content: "";

  position: absolute;

  width: 340px;
  height: 340px;

  right: -30px;
  top: -20px;

  border-radius: 50%;

  border:
    1px solid
    rgba(
      63,
      82,
      70,
      .09
    );

}


.rd-hero .rd-inner {

  position: relative;

  z-index: 2;

}


.rd-hero-copy {

  max-width: 820px;

}


.rd-hero-copy h1 {

  margin:
    0 0
    44px;

  font-family:
    var(--rd-serif);

  font-size:
    clamp(
      48px,
      6vw,
      82px
    );

  font-weight: 300;

  line-height: 1.38;

  letter-spacing: .035em;

  color:
    var(--rd-green-dark);

}


.rd-hero-lead {

  margin: 0;

  font-size: 16px;

  line-height: 2.15;

  letter-spacing: .045em;

  color: #59625c;

}


/* =========================================================
   INTRO
========================================================= */

.rd-intro {

  padding:
    150px 0
    160px;

  background:
    var(--rd-white);

}


.rd-intro-grid {

  display: grid;

  grid-template-columns:
    minmax(0, .9fr)
    minmax(0, 1fr);

  gap: 120px;

  align-items: start;

}


.rd-intro-heading h2 {

  margin: 0;

  font-family:
    var(--rd-serif);

  font-size:
    clamp(
      34px,
      4vw,
      54px
    );

  font-weight: 300;

  line-height: 1.55;

  letter-spacing: .035em;

  color:
    var(--rd-green-dark);

}


.rd-intro-text {

  padding-top: 47px;

}


.rd-intro-text p {

  margin:
    0 0
    30px;

  font-size: 16px;

  line-height: 2.15;

  letter-spacing: .035em;

  color: #555e58;

}


.rd-intro-text p:last-child {

  margin-bottom: 0;

}


/* =========================================================
   EMPLOYMENT
========================================================= */

.rd-employment {

  padding:
    150px 0
    170px;

  background:
    var(--rd-bg);

}


/* =========================================================
   TABS
========================================================= */

.rd-tabs {

  display: grid;

  grid-template-columns:
    repeat(3, 1fr);

  margin-bottom: 90px;

  border-top:
    1px solid
    var(--rd-line);

  border-bottom:
    1px solid
    var(--rd-line);

}


.rd-tab {

  position: relative;

  min-height: 82px;

  display: flex;

  align-items: center;
  justify-content: center;

  padding: 15px 20px;

  border: 0;

  border-right:
    1px solid
    var(--rd-line);

  background:
    transparent;

  font-family:
    var(--rd-serif);

  font-size: 17px;

  font-weight: 400;

  letter-spacing: .08em;

  color:
    var(--rd-muted);

  cursor: pointer;

  transition:
    color .35s ease,
    background .35s ease;

}


.rd-tab:last-child {

  border-right: 0;

}


.rd-tab::after {

  content: "";

  position: absolute;

  left: 50%;
  bottom: -1px;

  width: 0;
  height: 2px;

  transform:
    translateX(-50%);

  background:
    var(--rd-green);

  transition:
    width .4s
    cubic-bezier(
      .22,
      1,
      .36,
      1
    );

}


.rd-tab:hover {

  color:
    var(--rd-green);

}


.rd-tab.is-active {

  color:
    var(--rd-green-dark);

  background:
    rgba(
      255,
      255,
      255,
      .48
    );

}


.rd-tab.is-active::after {

  width: 100%;

}


/* =========================================================
   TAB PANEL
========================================================= */

.rd-tab-panel {

  animation:
    rdPanelFade
    .55s ease both;

}


.rd-tab-panel[hidden] {

  display: none;

}


@keyframes rdPanelFade {

  from {

    opacity: 0;

    transform:
      translateY(14px);

  }

  to {

    opacity: 1;

    transform:
      translateY(0);

  }

}


/* =========================================================
   JOB SUMMARY
========================================================= */

.rd-job-summary {

  display: grid;

  grid-template-columns:
    repeat(3, 1fr);

  margin-bottom: 110px;

  border-top:
    1px solid
    var(--rd-line);

  border-bottom:
    1px solid
    var(--rd-line);

}


.rd-job-summary > div {

  min-height: 235px;

  display: flex;

  flex-direction: column;

  justify-content: center;

  padding:
    45px
    42px;

  border-right:
    1px solid
    var(--rd-line);

}


.rd-job-summary > div:last-child {

  border-right: 0;

}


.rd-summary-label {

  margin:
    0 0
    25px;

  font-size: 13px;

  letter-spacing: .15em;

  color:
    var(--rd-muted);

}


.rd-summary-value {

  display: flex;

  align-items: baseline;

  gap: 8px;

  margin:
    0 0
    17px;

  color:
    var(--rd-green-dark);

}


.rd-summary-value strong {

  font-family:
    var(--rd-serif);

  font-size:
    clamp(
      40px,
      4.5vw,
      62px
    );

  font-weight: 300;

  line-height: 1;

  letter-spacing: -.02em;

}


.rd-summary-value span {

  font-size: 15px;

  letter-spacing: .04em;

}


.rd-summary-note {

  margin: 0;

  font-size: 14px;

  line-height: 1.8;

  color:
    var(--rd-muted);

}


/* =========================================================
   SALARY EXAMPLE
========================================================= */

.rd-salary-example {

  display: grid;

  grid-template-columns:
    .8fr
    1.2fr;

  margin-bottom: 130px;

  background:
    var(--rd-green);

  color: #fff;

}


.rd-salary-example-head {

  padding:
    65px
    60px;

  border-right:
    1px solid
    rgba(
      255,
      255,
      255,
      .17
    );

}


.rd-salary-example-head .rd-eyebrow {

  color:
    rgba(
      255,
      255,
      255,
      .62
    );

}


.rd-salary-example-head h3 {

  margin: 0;

  font-family:
    var(--rd-serif);

  font-size: 32px;

  font-weight: 300;

  letter-spacing: .05em;

}


.rd-salary-example-body {

  padding:
    65px
    65px;

}


.rd-salary-example-title {

  margin:
    0 0
    24px;

  font-size: 15px;

  line-height: 1.8;

  letter-spacing: .035em;

  color:
    rgba(
      255,
      255,
      255,
      .8
    );

}


.rd-salary-example-price {

  display: flex;

  align-items: baseline;

  gap: 10px;

  margin:
    0 0
    28px;

}


.rd-salary-example-price strong {

  font-family:
    var(--rd-serif);

  font-size:
    clamp(
      46px,
      5vw,
      68px
    );

  font-weight: 300;

  line-height: 1;

  letter-spacing: -.025em;

}


.rd-salary-example-price span {

  font-size: 15px;

}


.rd-salary-example-note {

  max-width: 560px;

  margin: 0;

  font-size: 14px;

  line-height: 1.9;

  color:
    rgba(
      255,
      255,
      255,
      .65
    );

}


/* =========================================================
   REQUIREMENTS
========================================================= */

.rd-requirements {

  max-width: 980px;

  margin:
    0 auto;

}


.rd-requirements-head {

  margin-bottom: 50px;

}


.rd-requirements-head h3 {

  margin: 0;

  font-family:
    var(--rd-serif);

  font-size:
    clamp(
      32px,
      3vw,
      44px
    );

  font-weight: 300;

  line-height: 1.4;

  letter-spacing: .04em;

  color:
    var(--rd-green-dark);

}


.rd-requirements-list {

  margin: 0;

  border-top:
    1px solid
    var(--rd-line);

}


.rd-requirements-list > div {

  display: grid;

  grid-template-columns:
    200px
    1fr;

  gap: 40px;

  padding:
    29px 10px;

  border-bottom:
    1px solid
    var(--rd-line);

}


.rd-requirements-list dt {

  margin: 0;

  font-size: 14px;

  font-weight: 500;

  line-height: 1.9;

  letter-spacing: .04em;

  color:
    var(--rd-green);

}


.rd-requirements-list dd {

  margin: 0;

  font-size: 15px;

  line-height: 1.95;

  letter-spacing: .025em;

  color: #505852;

}


/* =========================================================
   PENDING NOTE
========================================================= */

.rd-pending-note {

  margin:
    35px 0 0;

  padding:
    20px 24px;

  background:
    rgba(
      63,
      82,
      70,
      .055
    );

  font-size: 14px;

  line-height: 1.9;

  color:
    var(--rd-muted);

}


/* =========================================================
   NIGHT SHIFT
========================================================= */

.rd-night-highlight {

  display: flex;

  align-items: baseline;

  gap: 22px;

  margin-bottom: 55px;

  padding:
    45px
    50px;

  background:
    var(--rd-green);

  color: #fff;

}


.rd-night-highlight p {

  margin: 0;

  font-size: 15px;

  letter-spacing: .08em;

}


.rd-night-highlight strong {

  font-family:
    var(--rd-serif);

  font-size:
    clamp(
      42px,
      5vw,
      64px
    );

  font-weight: 300;

  line-height: 1;

}


/* =========================================================
   WORK ENVIRONMENT
========================================================= */

.rd-environment {

  padding:
    160px 0
    170px;

  background:
    var(--rd-white);

}


.rd-environment-grid {

  display: grid;

  grid-template-columns:
    repeat(2, 1fr);

  border-top:
    1px solid
    var(--rd-line);

  border-left:
    1px solid
    var(--rd-line);

}


.rd-environment-item {

  min-height: 300px;

  padding:
    55px
    55px;

  border-right:
    1px solid
    var(--rd-line);

  border-bottom:
    1px solid
    var(--rd-line);

}


.rd-environment-item > span {

  display: block;

  margin-bottom: 46px;

  font-family:
    var(--rd-serif);

  font-size: 13px;

  letter-spacing: .1em;

  color:
    rgba(
      63,
      82,
      70,
      .55
    );

}


.rd-environment-item h3 {

  margin:
    0 0
    24px;

  font-family:
    var(--rd-serif);

  font-size: 25px;

  font-weight: 300;

  line-height: 1.6;

  letter-spacing: .035em;

  color:
    var(--rd-green-dark);

}


.rd-environment-item p {

  max-width: 440px;

  margin: 0;

  font-size: 15px;

  line-height: 2;

  letter-spacing: .025em;

  color:
    var(--rd-muted);

}


/* =========================================================
   ENTRY
========================================================= */

.rd-entry {

  position: relative;

  padding:
    155px 0;

  background:
    var(--rd-green-dark);

  color: #fff;

  overflow: hidden;

}


.rd-entry::after {

  content: "ENTRY";

  position: absolute;

  right: -30px;
  bottom: -65px;

  font-family:
    var(--rd-serif);

  font-size:
    clamp(
      130px,
      19vw,
      290px
    );

  font-weight: 300;

  line-height: 1;

  letter-spacing: -.04em;

  color:
    rgba(
      255,
      255,
      255,
      .035
    );

  pointer-events: none;

}


.rd-entry .rd-inner {

  position: relative;

  z-index: 2;

}


.rd-entry-grid {

  display: grid;

  grid-template-columns:
    minmax(0, 1fr)
    minmax(360px, .8fr);

  gap: 110px;

  align-items: end;

}


.rd-entry-copy .rd-eyebrow {

  color:
    rgba(
      255,
      255,
      255,
      .52
    );

}


.rd-entry-copy h2 {

  margin:
    0 0
    38px;

  font-family:
    var(--rd-serif);

  font-size:
    clamp(
      42px,
      5vw,
      68px
    );

  font-weight: 300;

  line-height: 1.45;

  letter-spacing: .04em;

}


.rd-entry-copy > p:last-child {

  max-width: 520px;

  margin: 0;

  font-size: 15px;

  line-height: 2.05;

  letter-spacing: .03em;

  color:
    rgba(
      255,
      255,
      255,
      .7
    );

}


/* =========================================================
   ENTRY ACTIONS
========================================================= */

.rd-entry-actions {

  display: flex;

  flex-direction: column;

}


.rd-entry-tel {

  display: block;

  padding:
    0 0
    35px;

  border-bottom:
    1px solid
    rgba(
      255,
      255,
      255,
      .18
    );

  color: #fff;

  text-decoration: none;

}


.rd-entry-tel small {

  display: block;

  margin-bottom: 13px;

  font-size: 12px;

  letter-spacing: .16em;

  color:
    rgba(
      255,
      255,
      255,
      .5
    );

}


.rd-entry-tel strong {

  font-family:
    var(--rd-serif);

  font-size:
    clamp(
      32px,
      4vw,
      46px
    );

  font-weight: 300;

  letter-spacing: .035em;

}


.rd-entry-button {

  position: relative;

  display: flex;

  align-items: center;
  justify-content: space-between;

  min-height: 90px;

  margin-top: 30px;

  padding:
    0
    30px;

  border:
    1px solid
    rgba(
      255,
      255,
      255,
      .38
    );

  color: #fff;

  text-decoration: none;

  transition:
    background .35s ease,
    color .35s ease;

}


.rd-entry-button span {

  font-size: 15px;

  letter-spacing: .04em;

}


.rd-entry-button i {

  position: relative;

  display: block;

  width: 48px;
  height: 1px;

  background:
    currentColor;

}


.rd-entry-button i::after {

  content: "";

  position: absolute;

  right: 0;
  top: -4px;

  width: 9px;
  height: 9px;

  border-top:
    1px solid
    currentColor;

  border-right:
    1px solid
    currentColor;

  transform:
    rotate(45deg);

}


.rd-entry-button:hover {

  background: #fff;

  color:
    var(--rd-green-dark);

}


.rd-entry-back {

  align-self: flex-start;

  margin-top: 30px;

  padding-bottom: 4px;

  border-bottom:
    1px solid
    rgba(
      255,
      255,
      255,
      .35
    );

  font-size: 13px;

  letter-spacing: .05em;

  color:
    rgba(
      255,
      255,
      255,
      .65
    );

  text-decoration: none;

  transition:
    color .3s ease;

}


.rd-entry-back:hover {

  color: #fff;

}


/* =========================================================
   TABLET
========================================================= */

@media (
  max-width: 960px
) {

  .rd-inner {

    width:
      min(
        calc(100% - 56px),
        1180px
      );

  }


  .rd-intro-grid {

    grid-template-columns:
      1fr;

    gap: 60px;

  }


  .rd-intro-text {

    max-width: 700px;

    padding-top: 0;

  }


  .rd-job-summary {

    grid-template-columns:
      1fr;

  }


  .rd-job-summary > div {

    min-height: auto;

    border-right: 0;

    border-bottom:
      1px solid
      var(--rd-line);

  }


  .rd-job-summary > div:last-child {

    border-bottom: 0;

  }


  .rd-salary-example {

    grid-template-columns:
      1fr;

  }


  .rd-salary-example-head {

    border-right: 0;

    border-bottom:
      1px solid
      rgba(
        255,
        255,
        255,
        .17
      );

  }


  .rd-entry-grid {

    grid-template-columns:
      1fr;

    gap: 75px;

  }


  .rd-entry-actions {

    max-width: 580px;

  }

}


/* =========================================================
   MOBILE
========================================================= */

@media (
  max-width: 640px
) {


  /* COMMON */

  .rd-inner {

    width:
      calc(
        100% - 40px
      );

  }


  .rd-eyebrow {

    margin-bottom: 20px;

    font-size: 12px;

  }


  .rd-section-head {

    margin-bottom: 48px;

  }


  .rd-section-head h2 {

    font-size: 32px;

    line-height: 1.5;

  }


  /* HERO */

  .rd-hero {

    min-height: 70vh;

    padding:
      135px 0
      85px;

  }


  .rd-hero::before {

    width: 340px;
    height: 340px;

    right: -170px;
    top: -80px;

  }


  .rd-hero::after {

    width: 220px;
    height: 220px;

    right: -105px;
    top: -20px;

  }


  .rd-hero-copy h1 {

    margin-bottom: 34px;

    font-size:
      clamp(
        39px,
        11vw,
        52px
      );

    line-height: 1.45;

  }


  .rd-hero-lead {

    font-size: 15px;

    line-height: 2;

  }


  /* INTRO */

  .rd-intro {

    padding:
      100px 0
      110px;

  }


  .rd-intro-grid {

    gap: 45px;

  }


  .rd-intro-heading h2 {

    font-size: 31px;

    line-height: 1.55;

  }


  .rd-intro-text p {

    margin-bottom: 25px;

    font-size: 15px;

    line-height: 2;

  }


  /* EMPLOYMENT */

  .rd-employment {

    padding:
      100px 0
      115px;

  }


  /* TABS */

  .rd-tabs {

    margin-bottom: 65px;

  }


  .rd-tab {

    min-height: 68px;

    padding:
      12px 8px;

    font-size: 14px;

  }


  /* SUMMARY */

  .rd-job-summary {

    margin-bottom: 80px;

  }


  .rd-job-summary > div {

    padding:
      38px
      25px;

  }


  .rd-summary-label {

    margin-bottom: 20px;

    font-size: 12px;

  }


  .rd-summary-value strong {

    font-size: 43px;

  }


  .rd-summary-value span {

    font-size: 14px;

  }


  .rd-summary-note {

    font-size: 13px;

  }


  /* SALARY */

  .rd-salary-example {

    margin-bottom: 90px;

  }


  .rd-salary-example-head {

    padding:
      42px
      26px;

  }


  .rd-salary-example-head h3 {

    font-size: 27px;

  }


  .rd-salary-example-body {

    padding:
      42px
      26px;

  }


  .rd-salary-example-title {

    font-size: 14px;

  }


  .rd-salary-example-price {

    flex-wrap: wrap;

  }


  .rd-salary-example-price strong {

    font-size: 43px;

  }


  .rd-salary-example-note {

    font-size: 13px;

  }


  /* REQUIREMENTS */

  .rd-requirements-head {

    margin-bottom: 38px;

  }


  .rd-requirements-head h3 {

    font-size: 30px;

  }


  .rd-requirements-list > div {

    grid-template-columns:
      1fr;

    gap: 10px;

    padding:
      23px 3px;

  }


  .rd-requirements-list dt {

    font-size: 13px;

  }


  .rd-requirements-list dd {

    font-size: 14px;

    line-height: 1.9;

  }


  .rd-pending-note {

    font-size: 13px;

  }


  /* NIGHT */

  .rd-night-highlight {

    display: block;

    padding:
      35px
      27px;

  }


  .rd-night-highlight p {

    margin-bottom: 18px;

    font-size: 14px;

  }


  .rd-night-highlight strong {

    font-size: 45px;

  }


  /* ENVIRONMENT */

  .rd-environment {

    padding:
      105px 0
      115px;

  }


  .rd-environment-grid {

    grid-template-columns:
      1fr;

  }


  .rd-environment-item {

    min-height: auto;

    padding:
      40px
      27px;

  }


  .rd-environment-item > span {

    margin-bottom: 30px;

  }


  .rd-environment-item h3 {

    margin-bottom: 18px;

    font-size: 22px;

  }


  .rd-environment-item p {

    font-size: 14px;

    line-height: 1.95;

  }


  /* ENTRY */

  .rd-entry {

    padding:
      105px 0;

  }


  .rd-entry-grid {

    gap: 60px;

  }


  .rd-entry-copy h2 {

    margin-bottom: 30px;

    font-size: 39px;

  }


  .rd-entry-copy > p:last-child {

    font-size: 14px;

    line-height: 2;

  }


  .rd-entry-tel strong {

    font-size: 33px;

  }


  .rd-entry-button {

    min-height: 78px;

    padding:
      0 22px;

  }


  .rd-entry-button span {

    font-size: 14px;

  }


  .rd-entry-button i {

    width: 34px;

  }

}


/* =========================================================
   REDUCED MOTION
========================================================= */

@media (
  prefers-reduced-motion: reduce
) {

  .rd-reveal {

    opacity: 1;

    transform: none;

    transition: none;

  }


  .rd-tab-panel {

    animation: none;

  }

}




/* =========================================================
   NURSE / 2 TABS
========================================================= */

.rd-tabs-two {
  grid-template-columns: repeat(2, 1fr);
}


/* =========================================================
   REQUIREMENTS SPACING
========================================================= */

.rd-requirements-space {
  margin-top: 120px;
}


/* =========================================================
   VISIT AREA
========================================================= */

.rd-area {
  padding: 160px 0 170px;
  background: #eceee8;
}


.rd-area-grid {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  border-top: 1px solid var(--rd-line);
  border-left: 1px solid var(--rd-line);
}


.rd-area-item {
  min-height: 245px;
  padding: 42px 30px;
  border-right: 1px solid var(--rd-line);
  border-bottom: 1px solid var(--rd-line);
}


.rd-area-item > span {
  display: block;
  margin-bottom: 38px;

  font-size: 11px;
  letter-spacing: .13em;

  color: rgba(63, 82, 70, .5);
}


.rd-area-item h3 {
  margin: 0 0 20px;

  font-family: var(--rd-serif);
  font-size: 25px;
  font-weight: 300;

  color: var(--rd-green-dark);
}


.rd-area-item p {
  margin: 0;

  font-size: 14px;
  line-height: 1.9;

  color: var(--rd-muted);
}


/* 現在募集中 */

.rd-area-recruit {
  margin-top: 70px;
  padding: 55px 60px;

  background: var(--rd-green);
  color: #fff;
}


.rd-area-recruit-small {
  margin: 0 0 25px;

  font-size: 12px;
  letter-spacing: .16em;

  color: rgba(255, 255, 255, .58);
}


.rd-area-recruit-main {
  margin: 0;

  font-family: var(--rd-serif);

  font-size: clamp(
    25px,
    3vw,
    38px
  );

  font-weight: 300;
  line-height: 1.7;
  letter-spacing: .035em;
}


/* =========================================================
   BENEFITS
========================================================= */

.rd-benefits {
  padding: 150px 0 160px;
  background: var(--rd-bg);
}


.rd-benefits-list {
  display: flex;
  flex-wrap: wrap;

  border-top: 1px solid var(--rd-line);
  border-left: 1px solid var(--rd-line);
}


.rd-benefits-list span {
  width: 25%;

  min-height: 95px;

  display: flex;
  align-items: center;
  justify-content: center;

  padding: 20px;

  border-right: 1px solid var(--rd-line);
  border-bottom: 1px solid var(--rd-line);

  font-size: 14px;
  line-height: 1.7;
  letter-spacing: .035em;

  text-align: center;

  color: var(--rd-green-dark);
}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 960px) {

  .rd-area-grid {
    grid-template-columns: repeat(2, 1fr);
  }


  .rd-benefits-list span {
    width: 33.333%;
  }

}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 640px) {

  .rd-requirements-space {
    margin-top: 85px;
  }


  .rd-area {
    padding: 105px 0 115px;
  }


  .rd-area-grid {
    grid-template-columns: 1fr;
  }


  .rd-area-item {
    min-height: auto;
    padding: 34px 26px;
  }


  .rd-area-item > span {
    margin-bottom: 22px;
  }


  .rd-area-item h3 {
    margin-bottom: 14px;
    font-size: 23px;
  }


  .rd-area-item p {
    font-size: 14px;
  }


  .rd-area-recruit {
    margin-top: 50px;
    padding: 38px 27px;
  }


  .rd-area-recruit-main {
    font-size: 24px;
  }


  .rd-benefits {
    padding: 100px 0 110px;
  }


  .rd-benefits-list span {
    width: 50%;
    min-height: 82px;

    padding: 15px 10px;

    font-size: 13px;
  }

}


/* ========================================
   RECRUIT NURSE / RECRUITMENT STATUS
======================================== */

.rd-tab{
  gap:10px;
}

.rd-tab .rd-recruit-status{
  display:inline-flex;
  align-items:center;
  justify-content:center;

  min-height:22px;

  padding:0 8px;

  border:1px solid rgba(62,82,70,.20);

  font-size:10px;
  line-height:1;
  font-weight:400;
  letter-spacing:.04em;

  white-space:nowrap;
}

.rd-tab .rd-recruit-status.is-open{
  border-color:rgba(56,92,70,.34);
  background:rgba(66,103,80,.08);
  color:#3e624d;
}

.rd-tab .rd-recruit-status.is-closed{
  border-color:rgba(86,91,87,.18);
  background:rgba(86,91,87,.045);
  color:#7a7e7b;
}


.rd-recruit-notice{
  margin:0 0 clamp(42px,5vw,72px);

  padding:
    clamp(24px,3vw,38px)
    clamp(24px,3.5vw,46px);

  border-left:2px solid rgba(61,87,72,.35);

  background:rgba(247,245,240,.52);
}

.rd-recruit-notice.is-open{
  border-left-color:#506f5d;
}

.rd-recruit-notice.is-closed{
  border-left-color:rgba(98,104,100,.32);
}

.rd-recruit-notice-label{
  margin:0 0 12px;

  font-family:"Times New Roman",serif;
  font-size:10px;
  line-height:1;
  letter-spacing:.24em;

  color:#78827c;
}

.rd-recruit-notice-title{
  margin:0;

  font-family:"Noto Serif JP",serif;
  font-size:clamp(20px,2vw,28px);
  line-height:1.6;
  font-weight:300;
  letter-spacing:.04em;

  color:#3d4b43;
}

.rd-recruit-notice-text{
  margin:14px 0 0;

  font-size:14px;
  line-height:2;
  letter-spacing:.025em;

  color:#6e7671;
}

.rd-recruit-notice.is-closed .rd-recruit-notice-title{
  color:#666d69;
}

.rd-entry-button-inquiry{
  opacity:.88;
}


@media(max-width:767px){

  .rd-tab{
    flex-wrap:wrap;
    gap:6px 8px;
  }

  .rd-tab .rd-recruit-status{
    min-height:20px;
    padding:0 6px;
    font-size:9px;
  }

  .rd-recruit-notice{
    margin-bottom:36px;
    padding:22px 20px;
  }

  .rd-recruit-notice-title{
    font-size:20px;
  }

  .rd-recruit-notice-text{
    font-size:13px;
    line-height:1.9;
  }

}