@charset "utf-8";

/*****************************************
toppage.css
トップページのみで使うスタイル
******************************************/
*,
*::before,
*::after {
  box-sizing: border-box;
}

img {
  width: auto;
  max-width: 100%;
  height: auto;
}

*:focus:not(:focus-visible):not(a[href]):not(area[href]):not(button):not(input):not(select):not(textarea):not(summary):not(iframe):not(audio[controls]):not(video[controls]) {
  outline: none;
}

[tabindex="-1"]:focus,
div[tabindex]:focus,
:is(section, article, div)[id][tabindex]:focus,
:is(h1, h2, h3, h4, h5, h6)[tabindex]:focus {
  outline: none;
}

:root {
  --color-white: #ffffff;
  --color-text: #333333;

  /* Brand */
  --color-primary: #001466;
  --color-accent-red: #E60013;
  --color-accent-orange: #F16C00;
  --color-accent-green: #009541;
  --color-accent-brown: #AE0002;

  /* Border */
  --color-border: #CCCCCC;

  /* Button */
  --color-button-gray: #767676;
  --color-button-orange: #BE5200;
  --color-button-green: #00853A;
  --color-button-navy: #6672A3;

  /* Background */
  --color-bg-red: #FEF2F3;
  --color-bg-orange: #FEF8F2;
  --color-bg-green: #F2FAF5;
  --color-bg-navy: #F2F3F7;
  --color-bg-yellow: #FFF2CE;
  --color-bg-gray: #FAFAFA;

  /* Motion */
  --transition: 0.3s;
  --opacity: 0.7;
}

button {
  appearance: none;
  -webkit-appearance: none;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: inherit;
  font: inherit;
  font-family: inherit;
  font-size: inherit;
  font-weight: inherit;
  line-height: inherit;
  letter-spacing: inherit;
  text-align: inherit;
  cursor: pointer;
}

a,
a:link,
a:visited,
a:hover,
a:active {
  color: inherit;
  text-decoration: none;
}

@media (hover: hover) and (pointer: fine) {
  a:hover {
    text-decoration: none;
  }
}

/*layout*/
body {
  color: var(--color-text);
  font-family: "Noto Sans JP", Meiryo, sans-serif;
  font-size: 16px;
  font-weight: 400;
}

#main .content {
  max-width: 100%;
}

/*section layout*/
.l-section {
  padding: 80px 0;
}

@media screen and (max-width: 767px) {
  .l-section {
    padding: 60px 0;
  }
}

.l-sec_inner {
  max-width: 1230px;
  margin: auto;
  padding: 0 15px;
}

/*section heading*/
.l-sec_heading {
  margin-bottom: 48px;
  text-align: center;
}

@media screen and (max-width: 767px) {
  .l-sec_heading {
    margin-bottom: 40px;
  }
}

.l-sec_heading-en {
  display: inline-block;
  color: var(--color-accent-red);
  font-family: "Josefin Sans";
  font-size: 48px;
  font-style: normal;
  font-weight: 700;
  line-height: 150%;
  letter-spacing: 9.6px;
  position: relative;
}

@media screen and (max-width: 767px) {
  .l-sec_heading-en {
    margin-bottom: 0;
    font-size: 36px;
    letter-spacing: 7.2px;
  }
}

.l-sec_heading-title {
  color: var(--text);
  font-size: 18px;
  font-weight: 700;
}

.l-sec_heading-lead {
  margin-top: 20px;
}

@media screen and (max-width: 767px) {
  .l-sec_heading-lead {
    text-align: left;
  }
}

.l-sec_heading-icon {
  width: 89px;
  height: 89px;
  aspect-ratio: 1/1;
  position: absolute;
  top: -10px;
  left: -89px;
}

@media screen and (max-width: 767px) {
  .l-sec_heading-icon {
    width: 70px;
    height: 70px;
    top: 0;
    left: -70px;
  }
}

/*button*/
.c-btn {
  display: flex;
  width: 100%;
  padding: 8px 30px;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-align: center;
  font-weight: 700;
  cursor: pointer;
  transition: var(--transition);
  border: 1px solid var(--color-accent-red);
  background-color: var(--color-accent-red);
  border-radius: 999em;
  line-height: 1.2;
  position: relative;
}

@media (hover: hover) and (pointer: fine) {
  a.c-btn:hover {
    background-color: var(--color-white);
  }

  a.c-btn:hover::after,
  a.c-btn:hover span {
    color: var(--color-accent-red);
  }
}

.c-btn::after {
  content: "\E885";
  font-family: recop-iconfonts;
  position: absolute;
  right: 10px;
}

@media screen and (max-width: 767px) {
  .c-btn {
    font-size: 14px;
  }
}

.c-btn.is-anchor {
  max-width: none;
  width: auto;
  display: inline-block;
  text-align: center;
  padding: 8px 40px 8px 34px;
  border-radius: 999em;
  border-color: var(--color-button-gray);
  background-color: var(--color-button-gray);
}

.c-btn.is-anchor span {
  color: var(--color-white);
}

.c-btn.is-anchor::after {
  content: "\E886";
  font-family: recop-iconfonts;
  right: 15px;
  top: 50%;
  transform: translateY(-50%);
  color: var(--color-white);
}

@media (hover: hover) and (pointer: fine) {

  .c-btn.is-anchor:hover span,
  .c-btn.is-anchor:hover::after {
    color: var(--color-button-gray);
  }
}

/*fixed*/
html.fixed {
  overflow: hidden;
  width: 100%;
  height: 100%;
  scrollbar-gutter: stable;
}

/*overlay*/
.overlay {
  position: fixed;
  inset: 0;
  z-index: 90;
}

.overlay::before {
  content: "";
  position: absolute;
  inset: 0;
  margin: 0 auto;
  width: 100%;
  background: rgba(0, 0, 0, 0.40);
}

/*accordion*/
.accordionBtn_sp {
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background: var(--color-button-gray);
  flex-shrink: 0;
  position: relative;
}

.accordionBtn_sp::before,
.accordionBtn_sp::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  background: var(--color-white);
  transform: translate(-50%, -50%);
  transition: var(--transition);
}

.accordionBtn_sp::before {
  width: 8px;
  height: 2px;
}

.accordionBtn_sp::after {
  width: 2px;
  height: 8px;
}

.accordionBtn_sp[aria-expanded="true"]::after {
  opacity: 0;
}

@media screen and (min-width: 768px) {
  .accordionBtn_sp {
    display: none;
  }
}

/*****************************************
modal
*****************************************/
.modal {
  position: fixed;
  padding: 20px 25px 20px 15px;
  inset: 0;
  z-index: 1000;
  display: flex;
  align-items: center;
  justify-content: center;
}

.modal[hidden] {
  display: none;
}

/* modal container */
.modal_container {
  position: relative;
  width: min(100%, 1000px);
  padding: 10px;
  border-radius: 20px;
  background: var(--color-white);
}

/* modal body */
.modal_body {
  max-height: calc(100dvh - 200px);
  height: 100%;
  padding: 50px 40px 70px;
  overflow-y: auto;
}

@media screen and (max-width: 767px) {
  .modal_body {
    max-height: calc(90dvh - 60px);
    padding: 20px 20px 50px;
  }
}

/* modal trigger */
.c-modal_trigger {
  transition: var(--transition);
}

@media (hover: hover) and (pointer: fine) {
  .c-modal_trigger:hover {
    opacity: var(--opacity);
  }
}

/* modal close */
.modal_close {
  position: absolute;
  top: -20px;
  right: -20px;
  width: 70px;
  height: 70px;
  border: none;
  background: var(--color-accent-orange);
  border-radius: 999em;
  cursor: pointer;
  transition: var(--transition);
  z-index: 9999;
}

@media screen and (max-width: 767px) {
  .modal_close {
    width: 60px;
    height: 60px;
    top: -12px;
    right: -18px;
  }
}

.modal_close::before,
.modal_close::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 36px;
  height: 4px;
  background: var(--color-white);
}

.modal_close::before {
  transform: translate(-50%, -50%) rotate(45deg);
}

.modal_close::after {
  transform: translate(-50%, -50%) rotate(-45deg);
}

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

  .modal_close::before,
  .modal_close::after {
    width: 22px;
  }
}

@media (hover: hover) and (pointer: fine) {
  .modal_close:hover {
    opacity: var(--opacity);
  }
}

/*************************************************
header
*************************************************/
header #h_wrapper {
  max-width: 100%;
  min-height: auto;
  padding: 15px 30px;
}

#pc_title {
  width: calc(100% - 220px - 20px);
}

#pc_title .head-title {
  width: 100%;
  padding: 0;
  text-align: left;
  color: var(--color-primary);
}

#pc_title .head-title span:not(:last-child) {
  display: inline;
}

@media screen and (max-width: 767px) {
  header #h_wrapper {
    padding: 10px 20px;
    align-items: flex-start;
  }

  .head-title {
    display: flex;
    padding: 20px 15px;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    text-align: center;
    color: var(--color-primary);
    font-size: 14px;
    font-weight: 700;
    line-height: 1.2;
    background-color: var(--color-bg-navy);
  }

  #pc_title .head-title span:not(:last-child) {
    display: block;
  }
}

header img.logo {
  padding: 0;
}

@media only screen and (max-width: 767px) {
  header img.logo {
    max-width: 150px;
  }
}

/*****************************************
global nav
*****************************************/
.global_nav-wrapper {
  min-height: 61px;
}

@media screen and (max-width: 767px) {
  .global_nav-wrapper {
    min-height: 0;
  }
}

.global_nav {
  padding: 6.5px 0;
  background: var(--color-accent-red);
}

.global_nav.is-fixed {
  position: fixed;
  width: 100%;
  top: 0;
  left: 0;
  z-index: 10;
}

@media screen and (max-width: 767px) {
  .global_nav {
    padding: 0;
    background-color: var(--color-white);
  }
}

/* inner */
.global_nav_inner {
  max-width: 1083px;
  margin: 0 auto;
  padding: 0 10px;
  display: flex;
  align-items: center;
}

@media screen and (max-width: 767px) {
  .global_nav_inner {
    display: block;
    padding: 0;
  }
}

/* container */
.gnav-container {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  width: 100%;
}

@media screen and (max-width: 767px) {
  .gnav-container_wrapper {
    display: none;
    width: 100%;
    padding: 0;
    position: fixed;
    z-index: 100;
    top: 0;
    overflow-y: scroll;
    height: 100%;
  }

  .gnav-container {
    display: block;
    background-color: var(--color-white);
  }
}

/* head */
.global_nav_head {
  margin-bottom: 20px;
}

@media screen and (max-width: 767px) {
  .global_nav_head {
    padding: 10px 20px;
  }
}

/* logo */
.global_nav-logo {
  display: inline-block;
}

.global_nav-logo img {
  display: block;
  width: 150px;
  height: auto;
}

/* character */
.global_nav_character {
  width: 67px;
  margin: auto;
  margin-right: 0;
  right: 35px;
  position: relative;
}

/* btn */
.global_nav_btnList {
  max-width: 240px;
  margin: 0 auto;
  position: relative;
}

.global_nav-btn {
  width: 100%;
  min-height: 70px;
  font-size: 20px;
  font-weight: 700;
  border-radius: 999em;
  text-align: left;
  border-color: #F16C00;
  background-color: #F16C00;
}

.global_nav-btn::after {
  content: none;
}

.global_nav-btn span {
  color: var(--color-white) !important;
  position: relative;
}

.global_nav-btn span::after {
  margin-left: 15px;
  content: "\E907";
  font-family: recop-iconfonts;
  font-weight: normal;
}

/* category */
.global_nav_category-inner {
  display: flex;
  align-items: center;
  padding: 10px 24px 10px 52px;
  border-radius: 999em;
  background-color: var(--color-bg-yellow);
  position: relative;
}

@media screen and (max-width: 767px) {
  .global_nav_category {
    background: linear-gradient(to bottom, var(--color-white) 0%, var(--color-white) 50%, var(--color-accent-red) 50%, var(--color-accent-red) 100%);
  }
}

@media screen and (max-width: 767px) {
  .global_nav_category-inner {
    width: 100%;
    padding: 20px 50px;
    flex-direction: column;
  }
}

/* heading */
.global_nav_heading {
  white-space: nowrap;
  font-size: 16px;
  font-weight: 700;
  color: var(--color-accent-red);
  position: relative;
}

@media screen and (max-width: 767px) {
  .global_nav_heading {
    margin-bottom: 18px;
    text-align: center;
  }
}

.global_nav_heading::before {
  content: "";
  width: 42px;
  height: 45px;
  background: url("/jobfind-pc/original/images/icon_flash_red.png") no-repeat center/contain;
  position: absolute;
  left: -42px;
  top: 50%;
  transform: translateY(-50%);
}

@media screen and (max-width: 767px) {
  .global_nav_heading::after {
    content: "";
    width: 42px;
    height: 45px;
    background: url("/jobfind-pc/original/images/icon_flash_red.png") no-repeat center/contain;
    position: absolute;
    right: -42px;
    top: 50%;
    transform: scale(-1, 1) translateY(-50%);
  }
}

/* category list */
.global_nav_categoryList {
  margin-left: 12px;
  display: flex;
  gap: 6px;
}

@media screen and (max-width: 767px) {
  .global_nav_categoryList {
    justify-content: center;
  }
}

/* category item */
.global_nav_categoryList a {
  flex-direction: inherit;
  gap: 8px;
  min-width: 72px;
  padding: 0;
  border-width: 2px;
  border-radius: 999px;
  background: var(--color-accent-red);
  color: var(--color-white) !important;
  transition: var(--transition);
}

.global_nav_categoryList a::after {
  position: inherit;
  content: "\E886";
  font-family: recop-iconfonts;
  right: auto;
}

@media (hover: hover) and (pointer: fine) {
  .global_nav_categoryList a:hover {
    opacity: var(--opacity);
  }
}

@media screen and (max-width: 767px) {
  .global_nav_categoryList a {
    width: 70px;
    height: 70px;
    aspect-ratio: 1;
    border-radius: 50%;
    flex-direction: column;
    padding: 0;
  }

  .global_nav_categoryList a::after {
    position: absolute;
    bottom: 5px;
  }

  .global_nav_categoryList span {
    margin-bottom: 10px;
  }
}

/* nav list */
.global_nav_list {
  display: flex;
  align-items: center;
}

@media screen and (max-width: 767px) {
  .global_nav_list {
    display: block;
    padding: 12px 40px 60px;
    background-color: var(--color-accent-red);
  }
}

/* nav link */
.global_nav_item a.c-btn {
  display: flex;
  padding: 0 20px;
  color: var(--color-white) !important;
  gap: 8px;
  height: 48px;
  text-decoration: none;
  transition: var(--transition);
  position: relative;
}

.global_nav_item a.c-btn::after {
  content: "\E886";
  font-family: recop-iconfonts;
}

@media screen and (max-width: 767px) {
  .global_nav_item a.c-btn {
    height: auto;
    padding: 18px 20px 16px 0;
    border-radius: 0;
    border-bottom: 1px solid var(--color-white);
  }

  .global_nav_item a.c-btn::after {
    position: absolute;
    right: 10px;
  }
}

.global_nav_item span {
  padding-right: 8px;
}

@media screen and (min-width: 768px) and (max-width: 1083px) {
  .gnav-container {
    gap: 1.8467vw;
  }

  .global_nav_category-inner {
    padding: 0.9234vw 2.2161vw 0.9234vw 4.8015vw;
  }

  .global_nav_item a.c-btn {
    padding: 0 1.8467vw;
    gap: 0.7387vw;
    font-size: max(13px, 1.4774vw);
  }

  .global_nav_heading {
    font-size: 1.4774vw;
  }

  .global_nav_heading::before {
    width: 3.8781vw;
    height: 4.1551vw;
    left: -3.8781vw;
  }

  .global_nav_categoryList {
    margin-left: 1.1080vw;
    gap: 0.5540vw;
  }


  .global_nav_categoryList a {
    gap: 0.7387vw;
    min-width: 6.6482vw;
    border-width: 0.1847vw;
    font-size: 1.4774vw;
  }
}

/* menu button */
.gnav-trigger {
  width: 55px;
  height: 55px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--color-accent-red);
  border-radius: 50%;
  flex-shrink: 0;
  position: fixed;
  top: 10px;
  right: 10px;
  background-color: var(--color-accent-red);
  transition: var(--transition);
  box-shadow: 2px 2px 6px 0 rgba(0, 0, 0, 0.25);
  z-index: 999;
}

@media (hover: hover) and (pointer: fine) {
  .gnav-trigger:hover {
    opacity: var(--opacity);
  }
}

@media screen and (min-width: 768px) {
  .gnav-trigger {
    display: none;
  }
}

.hamburger-line {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
}

.hamburger-line .line {
  width: 30px;
  height: 2px;
  border-radius: 999em;
  background-color: var(--color-white);
  transition: var(--transition);
}

.gnav-trigger_text {
  display: block;
  color: var(--color-white);
  font-family: "Josefin Sans";
  font-size: 10px;
  font-weight: 700;
  text-align: center;
  position: relative;
  bottom: -5px;
}

.gnav-trigger_text::before {
  content: "MENU";
}

/*open*/
.opened.gnav-trigger {
  background-color: var(--color-white);
  box-shadow: none;
}

.opened .hamburger-line .line {
  background-color: var(--color-accent-red);
}

.opened .hamburger-line .line:nth-child(1) {
  transform: translateY(2px) rotate(25deg);
}

.opened .hamburger-line .line:nth-child(2) {
  transform: translateY(-4px) rotate(-25deg);
}

.opened .gnav-trigger_text::before {
  content: "CLOSE";
  color: var(--color-accent-red);
}

/*****************************************
kv
*****************************************/
.kv {
  position: relative;
  background: var(--color-white);
  position: relative;
}

/* contents */
.kv_contents {
  position: relative;
}

/* main */
.kv_main {
  position: absolute;
  width: 100%;
  bottom: 1.5vw;
  left: 50%;
  transform: translateX(-50%);
  z-index: 2;
}

@media screen and (max-width: 767px) {
  .kv_main {
    position: static;
    transform: none;
  }
}

/* copy */
.kv_copy-text {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  color: var(--color-accent-red);
  font-size: 2.8571vw;
  font-weight: 700;
  text-align: center;
}

.kv_copy-text span {
  display: inline-block;
  padding: 0.3vw 1.4283vw;
  justify-content: center;
  align-items: center;
  background-color: var(--color-white);
  line-height: 1.2;
}

@media screen and (max-width: 767px) {
  .kv_copy-text {
    font-size: 6.9333vw;
    text-align: left;
    padding: 4vw 5.3333vw;
    align-items: flex-start;
    line-height: 1.4;
  }
}

/* text */
.kv_text {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  font-size: max(16px, 1.1427vw);
  color: #4B4B4B;
  font-weight: 700;
}

.kv_text span {
  display: inline-block;
  padding: 0 1.4283vw;
  justify-content: center;
  align-items: center;
  background-color: var(--color-white);
}

@media screen and (max-width: 767px) {
  .kv_text {
    padding: 13.6667vw 5.3333vw 8vw;
    color: var(--color-white);
    background-color: var(--color-accent-red);
    display: block;
    font-size: 4.2667vw;
  }

  .kv_text span {
    display: block;
    padding: 0;
    background-color: transparent;
  }

  .kv_text span:not(:last-of-type) {
    padding-right: 30.6667vw;
  }
}

/*btn*/
.kv_btnList {
  text-align: center;
}

@media screen and (max-width: 767px) {
  .kv_btnList {
    position: absolute;
    z-index: 5;
    right: 10px;
    top: 44%;
  }
}

.kv_btnList li {
  display: inline-block;
}

.kv_btn {
  margin-top: 7.8543vw;
  width: 8.2142vw;
  height: 8.2142vw;
  padding: 0;
  aspect-ratio: 1;
  border-radius: 50%;
  border-color: transparent;
  background: var(--color-accent-orange);
  flex-direction: column;
  font-size: 1.7142vw;
  font-weight: 700;
  gap: 0.6861vw;
  text-decoration: none;
  box-shadow: 0 0.4288vw 0.8576vw rgba(0, 0, 0, 0.2);
  transition: var(--transition);
  position: relative;
}

.kv_btn::before {
  content: "";
  width: 7.7131vw;
  height: 7.7131vw;
  aspect-ratio: 1/1;
  background: url("/jobfind-pc/original/images/icon_tomato_kv-btn.png") no-repeat center/contain;
  position: absolute;
  top: -7.7131vw;
  left: 50%;
  transform: translateX(-56%);
  display: block;
  transition: var(--transition);
}

.kv_btn:hover::before {
  top: -8.2142vw;
}

.kv_btn span {
  display: block;
  text-align: center;
  color: var(--color-white);
  line-height: 1.1;
}

.kv_btn::after {
  content: "\E907";
  font-family: recop-iconfonts;
  font-size: 1.2854vw;
  font-weight: normal;
  position: static;
  color: var(--color-white);
  line-height: 1;
}

@media (hover: hover) and (pointer: fine) {
  a.kv_btn:hover {
    color: var(--color-white);
    background-color: var(--color-accent-red);
    opacity: 1;
  }

  a.kv_btn:hover span,
  a.kv_btn:hover::after {
    color: var(--color-white);
    opacity: 1;
  }
}

@media screen and (max-width: 767px) {
  .kv_btn {
    margin-top: 28vw;
    width: 26.6667vw;
    height: 26.6667vw;
    font-size: 5.3333vw;
    gap: 1.0667vw;
    box-shadow: 0.5333vw 0.5333vw 1.6vw 0 rgba(0, 0, 0, 0.25);
  }

  .kv_btn::before {
    content: "";
    width: 28.5333vw;
    height: 28vw;
    aspect-ratio: 107/105;
    top: -27.7333vw;
  }

  .kv_btn:hover::before {
    top: -29.3333vw;
  }

  .kv_btn::after {
    font-size: 3.7333vw;
  }
}

/*****************************************
images
*****************************************/
.kv_images {
  position: relative;
}

@media screen and (max-width: 767px) {
  .kv_images {
    padding: 0 5.3333vw;
    padding-bottom: 24.5333vw;
  }
}

/* image */
.kv_image-main {
  width: 43.5714vw;
}

.kv_image-main img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

@media screen and (max-width: 767px) {
  .kv_image-main {
    width: 74.1333vw;
    height: 64vw;
  }

  .kv_image-main img{
    object-position: top center;
  }
}

/* image list */
.kv_imageItem {
  position: absolute;
  overflow: hidden;
}

.kv_imageItem img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

@media screen and (max-width: 767px) {
  .kv_imageItem img {
    object-position: top center;
  }
}

.kv_imageItem-01 {
  width: 10.2852vw;
  height: 6.1428vw;
  top: 1.4283vw;
  right: 28.9282vw;
}

@media screen and (max-width: 767px) {
  .kv_imageItem-01 {
    width: 21.3333vw;
    height: 16vw;
    top: auto;
    bottom: -25.0667vw;
    right: 4.5333vw;
  }
}

.kv_imageItem-02 {
  width: 18.2857vw;
  height: 18.2857vw;
  top: 5.5714vw;
  right: 4.2857vw;
}

@media screen and (max-width: 767px) {
  .kv_imageItem-02 {
    width: 38.4vw;
    height: 32.5333vw;
    top: -16vw;
    right: 0;
  }
}

.kv_imageItem-03 {
  width: 11.7850vw;
  height: 9.7850vw;
  bottom: 7.0712vw;
  right: 23.4960vw;
}

@media screen and (max-width: 767px) {
  .kv_imageItem-03 {
    width: 38.4vw;
    height: 28.5333vw;
    bottom: 0;
    right: auto;
    left: 0;
  }
}

.kv_imageItem-04 {
  width: 20.5713vw;
  height: 11.8577vw;
  bottom: 3.2146vw;
  right: 0;
}

@media screen and (max-width: 767px) {
  .kv_imageItem-04 {
    width: 26.6667vw;
    height: 21.3333vw;
    bottom: -9.0667vw;
    right: 18.4vw;
  }
}

/*****************************************
kv deco
*****************************************/
/* deco item */
.kv_decoItem {
  position: absolute;
}

.kv_decoItem img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

@media screen and (max-width: 767px) {
  .kv_decoItem {
    z-index: 1;
  }
}

/* tomato */
.kv_decoItem-tomato {
  width: 5.7141vw;
  height: 5.5036vw;
  aspect-ratio: 80/77;
  top: 0;
  right: 51.2160vw;
}

@media screen and (max-width: 767px) {
  .kv_decoItem-tomato {
    width: 18.6667vw;
    height: 17.8667vw;
    aspect-ratio: 70/67;
    top: auto;
    right: 44%;
    bottom: 94.2vw;
  }
}

/* tomato_walk*/
.kv_decoItem-tomato_walk {
  width: 5.6429vw;
  height: 5.6429vw;
  aspect-ratio: 1 / 1;
  top: 7.1429vw;
  right: 22.1429vw;
}

@media screen and (max-width: 767px) {
  .kv_decoItem-tomato_walk {
    width: 18.6667vw;
    height: 17.8667vw;
    aspect-ratio: 70 / 67;
    right: 27.3333vw;
    top: -6vw;
  }
}

/* cabbage */
.kv_decoItem-cabbage {
  width: 5.7809vw;
  height: 4.9293vw;
  aspect-ratio: 27/23;
  top: 0;
  right: 42.7060vw;
}

@media screen and (max-width: 767px) {
  .kv_decoItem-cabbage {
    width: 13.6vw;
    height: 11.7333vw;
    aspect-ratio: 51 / 44;
    top: 14.6667vw;
    right: 21.3333vw;
  }
}

/* momo */
.kv_decoItem-momo {
  width: 4.2114vw;
  height: 3.5690vw;
  transform: rotate(-19.68deg);
  aspect-ratio: 59/50;
  top: 2.5757vw;
  right: 39.2783vw;
}

@media screen and (max-width: 767px) {
  .kv_decoItem-momo {
    width: 11.3405vw;
    height: 9.696vw;
    aspect-ratio: 42.53/36.36;
    top: 22.6667vw;
    right: 32vw;
  }
}

/* donut */
.kv_decoItem-donut {
  width: 6.1440vw;
  height: 4.2874vw;
  aspect-ratio: 43/30;
  top: 13.7145vw;
  right: 21.6410vw;
}

@media screen and (max-width: 767px) {
  .kv_decoItem-donut {
    width: 17.3333vw;
    height: 13.6vw;
    aspect-ratio: 65/51;
    top: 9vw;
    right: 0vw;
  }
}

/* strawberry */
.kv_decoItem-strawberry {
  width: 4.4971vw;
  height: 3.8573vw;
  aspect-ratio: 7/6;
  top: 14.4241vw;
  right: 29.0014vw;
}

@media screen and (max-width: 767px) {
  .kv_decoItem-strawberry {
    width: 10.9333vw;
    height: 9.3333vw;
    aspect-ratio: 41/35;
    top: 5.6667vw;
    right: 18vw;
  }
}

/* yogurt */
.kv_decoItem-yogurt {
  width: 6.2129vw;
  height: 5.2834vw;
  aspect-ratio: 87/74;
  bottom: 6.9297vw;
  right: 35.9319vw;
}

@media screen and (max-width: 767px) {
  .kv_decoItem-yogurt {
    width: 13.0667vw;
    height: 11.2vw;
    aspect-ratio: 7/6;
    bottom: 89.3333vw;
    right: 5.3333vw;
  }
}

/* cart */
.kv_decoItem-cart {
  width: 6.5757vw;
  height: 6.5757vw;
  aspect-ratio: 1/1;
  bottom: 0.3541vw;
  right: 29.3557vw;
}

@media screen and (max-width: 767px) {
  .kv_decoItem-cart {
    width: 16.5333vw;
    height: 15.7333vw;
    aspect-ratio: 62 / 59;
    bottom: 40vw;
    right: 4vw;
  }
}

/* candy */
.kv_decoItem-candy {
  width: 4.0009vw;
  height: 3.4169vw;
  transform: rotate(-12.428deg);
  aspect-ratio: 55.97/47.85;
  bottom: 2.4986vw;
  right: 25.3547vw;
}

@media screen and (max-width: 767px) {
  .kv_decoItem-candy {
    width: 9.4592vw;
    height: 8.0877vw;
    aspect-ratio: 35.47/30.33;
    bottom: 50.6667vw;
    right: 18.6667vw;
  }
}

/* fish */
.kv_decoItem-fish {
  width: 4.7187vw;
  height: 4.0009vw;
  aspect-ratio: 33/28;
  bottom: 15.4349vw;
  right: 13.9254vw;
}

@media screen and (max-width: 767px) {
  .kv_decoItem-fish {
    width: 13.6000vw;
    height: 11.4667vw;
    aspect-ratio: 51/43;
    bottom: 107.0000vw;
    right: 24.0000vw;
  }
}

/* bacon */
.kv_decoItem-bacon {
  width: 5.1399vw;
  height: 4.3549vw;
  aspect-ratio: 72/61;
  bottom: 16.0706vw;
  right: 18.9950vw;
}

@media screen and (max-width: 767px) {
  .kv_decoItem-bacon {
    width: 13.6000vw;
    height: 11.7333vw;
    aspect-ratio: 51/44;
    bottom: 111.0000vw;
    right: 37.3333vw;
  }
}

/* line */
.kv_decoItem-line {
  width: 4.2874vw;
  height: 4.6239vw;
  transform: rotate(6.267deg);
  aspect-ratio: 38/41;
  right: 42.1430vw;
  bottom: 0;
}

@media screen and (max-width: 767px) {
  .kv_decoItem-line {
    width: 8.8245vw;
    height: 10.9301vw;
    bottom: 109.3333vw;
    right: 1.3333vw;
  }
}

/*****************************************
slider
*****************************************/
/* controller */
.kv_controller {
  display: flex;
  align-items: center;
  gap: 12px;
  position: absolute;
  right: 30px;
  bottom: 10px;
  z-index: 10;
}

@media screen and (max-width: 767px) {
  .kv_controller {
    right: auto;
    left: 20px;
    bottom: -35px;
  }
}

/* pause */
.kv_pause {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 19px;
  height: 19px;
  aspect-ratio: 1;
  border-radius: 50%;
  background: var(--color-accent-red);
  position: relative;
  transition: var(--transition);
}

.kv_pause::before {
  content: "\E987";
  font-family: recop-iconfonts;
  color: #fff;
  font-size: 12px;
  display: block;
  padding-top: 2px;
}

.kv_pause.is-paused::before {
  content: "\E994";
  padding-left: 2px;
}

@media (hover: hover) and (pointer: fine) {
  .kv_pause:hover {
    opacity: var(--opacity);
  }
}

@media screen and (max-width: 767px) {
  .kv_pause {
    background-color: var(--color-white);
  }

  .kv_pause::before,
  .kv_pause.is-paused::before {
    color: var(--color-accent-red);
    padding: 0;
  }
}

/* pagination */
.kv_pagination .splide__pagination {
  position: static;
  display: flex;
  padding: 0;
  align-items: center;
  width: 100%;
  gap: 10px;
}

.kv_pagination .splide__pagination li {
  flex: 1;
  line-height: 0
}

.kv_pagination .splide__pagination__page {
  width: 40px;
  height: 4px;
  margin: 0;
  background: #d9d9d9;
  border-radius: 0;
  opacity: 1;
  transform: none;
  transition: background-color var(--transition);
}

.kv_pagination .splide__pagination__page.is-active {
  background: var(--color-accent-red);
  transform: none;
}

@media screen and (max-width: 767px) {
  .kv_pagination .splide__pagination__page {
    width: 30px;
  }

  .kv_pagination .splide__pagination__page.is-active {
    background-color: var(--color-white);
  }
}

/* splide */
.js-slider {
  visibility: hidden;
}

.js-slider.is-initialized {
  visibility: visible;
}

.splide__track {
  overflow: visible;
}

.splide__list {
  align-items: stretch;
}

.splide__slide {
  position: relative;
}

/*****************************************
job search
*****************************************/
.job_search {
  background: var(--color-white);
}

/* freeword */
.job_search_freeword {
  max-width: 1000px;
  margin: auto;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 20px;
  padding: 32px 15px;
  background: var(--color-bg-navy);
  border-radius: 999px;
}

@media screen and (max-width: 767px) {
  .job_search_freeword {
    display: block;
    text-align: center;
    padding: 12px 24px;
  }
}

/* character */
.job_search_character {
  font-size: 18px;
  font-weight: 700;
  position: relative;
}

.job_search_character img {
  position: absolute;
  width: 89px;
  height: 89px;
  aspect-ratio: 1/1;
  left: -89px;
  top: 50%;
  transform: translateY(-50%);
}

@media screen and (max-width: 767px) {
  .job_search_character {
    margin-bottom: 10px;
  }

  .job_search_character img {
    width: 70px;
    height: 67px;
    aspect-ratio: 70 / 67;
    left: auto;
    right: 10px;
    top: -26px;
    transform: scale(-1, 1);
  }
}

/* form */
.job_search_freeword form {
  width: 100%;
  max-width: 400px;
  position: relative;
}

/* input */
.job_search_freeword input[type="text"] {
  width: 100%;
  padding: 18px 50px 14px 15px;
  background: var(--color-white);
  border: none;
  border-radius: 999px;
  appearance: none;
}

.job_search_freeword input[type="text"]::placeholder {
  color: #aaa;
  font-size: 16px;
}

.job_search_freeword input[type="text"]:focus {
  outline: 2px solid var(--color-primary);
  outline-offset: 2px;
}

/* search button */
.job_search_freeword button {
  position: absolute;
  top: 50%;
  width: 50px;
  height: 100%;
  right: 5px;
  transform: translateY(-50%);
  border: none;
  background: url("/jobfind-pc/original/images/icon_search.png") no-repeat center/20px 20px;
  cursor: pointer;
  transition: var(--transition);
}

@media (hover: hover) and (pointer: fine) {
  .job_search_freeword button:hover {
    opacity: var(--opacity);
  }
}

/* text */
.job_search_text {
  margin-top: 48px;
  font-size: 26px;
  font-weight: 700;
  text-align: center;
}

@media screen and (max-width: 767px) {
  .job_search_text {
    margin-top: 40px;
    font-size: 22px;
  }
}

/* workstyle */
.job_search_workstyle {
  border-radius: 20px;
  padding: 60px 20px 80px;
  border: 2px solid var(--color-border);
  background: var(--color-white);
}

@media screen and (max-width: 767px) {
  .job_search_workstyle {
    padding: 40px 15px;
  }
}

.job_search_workstyle-inner {
  max-width: 900px;
  margin: auto;
}

/* head */
.job_search_head {
  text-align: center;
}

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

/* heading */
.job_search_heading {
  font-size: 34px;
  font-weight: 700;
}

@media screen and (max-width: 767px) {
  .job_search_heading {
    font-size: 20px;
  }
}

.job_search_sub {
  font-weight: 700;
}

/* anchor list */
.job_search_anchorList {
  margin-top: 40px;
  display: flex;
  justify-content: center;
  font-size: 18px;
  gap: 16px;
}

@media screen and (max-width: 767px) {
  .job_search_anchorList {
    margin-top: 30px;
    gap: 4px;
    align-items: center;
  }
}

/* anchor item */
.job_search_anchorList li {
  flex: 1;
  max-width: 240px;
}

@media screen and (max-width: 767px) {
  .job_search_anchorList li {
    max-width: none;
    flex: none;
  }

  .job_search_anchorList li+li {
    margin-top: 0;
  }
}

/* anchor */
.job_search_anchor {
  display: flex;
  justify-content: center;
  align-items: center;
  min-height: 50px;
  padding: 0 30px;
  border-radius: 999px;
  font-size: 18px;
  font-weight: 700;
  text-align: center;
  text-decoration: none;
  position: relative;
  border: 2px solid;
  transition: var(--transition);
  line-height: 1.2;
}

.job_search_anchor::after {
  margin-left: 0;
  content: "\E886";
  font-family: recop-iconfonts;
  position: absolute;
  top: 50%;
  right: 20px;
  transform: translateY(-50%);
}

@media (hover: hover) and (pointer: fine) {
  .job_search_anchor:hover {
    opacity: var(--opacity);
  }
}

@media screen and (max-width: 767px) {
  .job_search_anchor {
    padding: 0 20px;
    flex-direction: column;
    font-size: 14px;
    min-height: 55px;
  }

  .job_search_anchor::after {
    position: relative;
    top: auto;
    right: auto;
    transform: none;
  }
}

/* contents */
.job_search_contents {
  margin-top: 30px;
}

@media screen and (max-width: 767px) {
  .job_search_contents {
    margin-top: 10px;
  }
}

.job_search_content {
  padding: 30px 15px 40px;
  border-radius: 20px;
}

.job_search_content+.job_search_content {
  margin-top: 32px;
}

@media screen and (max-width: 767px) {
  .job_search_content+.job_search_content {
    margin-top: 20px;
  }
}

/* content title */
.job_search_content-title {
  max-width: 772px;
  margin: 0 auto 30px;
  padding-bottom: 8px;
  font-size: 24px;
  font-weight: 700;
  text-align: center;
  border-bottom: 1px solid var(--color-border);
}

@media screen and (max-width: 767px) {
  .job_search_content-title {
    margin-bottom: 20px;
    font-size: 20px;
  }

}

/* brand list */
.job_search_brandList {
  max-width: 772px;
  margin: auto;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
}

@media screen and (max-width: 767px) {
  .job_search_brandList {
    gap: 10px;
    grid-template-columns: repeat(2, 1fr);
  }
}

.job_search_brandList .c-btn {
  width: 100%;
  min-height: 50px;
  font-size: 18px;
  border-radius: 999em;
}

.job_search_brandList .c-btn::after {
  content: none;
}

.job_search_brandList .c-btn span,
.job_search_brandList .c-btn:hover span {
  color: var(--color-white);
}

.job_search_btnList {
  margin-top: 40px;
  text-align: center;
}

/* fulltime */
.job_search_anchor.is-fulltime {
  border-color: var(--color-accent-brown);
  background-color: var(--color-bg-red);
}

.job_search_anchor.is-fulltime::after,
.job_search_anchor.is-fulltime span {
  color: var(--color-accent-brown);
}

.job_search_content.is-fulltime {
  background-color: var(--color-bg-red);
}

.job_search_content.is-fulltime .c-btn {
  border-color: var(--color-accent-brown);
  background-color: var(--color-accent-brown);
}

/* part */
.job_search_anchor.is-part {
  border-color: var(--color-button-orange);
  background-color: var(--color-bg-orange);
}

.job_search_anchor.is-part::after,
.job_search_anchor.is-part span {
  color: var(--color-button-orange);
}

.job_search_content.is-part {
  background-color: var(--color-bg-orange);
}

.job_search_content.is-part .c-btn {
  border-color: var(--color-button-orange);
  background-color: var(--color-button-orange);
}

/* student */
.job_search_anchor.is-student {
  border-color: var(--color-button-green);
  background-color: var(--color-bg-green);
}

.job_search_anchor.is-student::after,
.job_search_anchor.is-student span {
  color: var(--color-button-green);
}

.job_search_content.is-student {
  background-color: var(--color-bg-green);
}

.job_search_content.is-student .c-btn {
  border-color: var(--color-button-green);
  background-color: var(--color-button-green);
}

@media (hover: hover) and (pointer: fine) {
  .job_search_content a.c-btn:hover {
    opacity: var(--opacity);
  }
}

/*****************************************
job search tab
*****************************************/
/* tab */
.job_search_tab {
  margin-top: 30px;
  display: flex;
  gap: 8px;
  justify-content: center;
}

@media screen and (max-width: 767px) {
  .job_search_tab {
    flex-wrap: wrap;
    gap: 6px 16px;
  }
}

/* item */
.job_search_tab li {
  flex: 1;
  max-width: 270px;
  padding-bottom: 16px;
}

@media screen and (max-width: 767px) {
  .job_search_tab li {
    flex: 0 0 calc((100% - 16px) / 2);
    max-width: calc((100% - 16px) / 2);
    padding-bottom: 10px;
  }
}

/* button */
.job_search_tab button {
  width: 100%;
  height: 100%;
  padding: 20px;
  color: var(--color-accent-red);
  background: var(--color-white);
  border: 2px solid var(--color-accent-red);
  border-radius: 20px;
  font-weight: 700;
  text-align: center;
  position: relative;
  transition: var(--transition);
  line-height: 1.2;
}

.job_search_tab button::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: -16px;
  transform: translateX(-50%);
  width: 30px;
  height: 16px;
  background: var(--color-accent-red);
  clip-path: polygon(50% 100%, 0 0, 100% 0);
  opacity: 0;
  visibility: hidden;
  transition: var(--transition);
}

.job_search_tab button[aria-selected="true"] {
  color: var(--color-white);
  background: var(--color-accent-red);
}

.job_search_tab button[aria-selected="true"]::after {
  opacity: 1;
  visibility: visible;
}

.job_search_tab button em {
  font-size: 20px;
}

.job_search_tab button .em-block {
  display: block;
}

.job_search_tab button small {
  display: block;
  font-size: 14px;
}

@media (hover: hover) and (pointer: fine) {
  .job_search_tab button:hover {
    opacity: var(--opacity);
    cursor: pointer;
  }
}

@media screen and (max-width: 767px) {
  .job_search_tab button {
    min-height: 75px;
    padding: 2px 10px;
    border-radius: 12px;
  }

  .job_search_tab button em {
    display: block;
    font-size: 18px;
  }

  .job_search_tab button::after {
    width: 16px;
    height: 12px;
    bottom: -12px;
  }
}

/*****************************************
job search nav
*****************************************/
.job_search_nav {
  margin-top: 15px;
  display: flex;
  gap: 8px;
  justify-content: center;
}

@media screen and (max-width: 767px) {
  .job_search_nav {
    flex-wrap: wrap;
    gap: 6px 16px;
  }
}

/* item */
.job_search_nav li {
  flex: 1;
  max-width: 270px;
  padding-top: 16px;
}

@media screen and (max-width: 767px) {
  .job_search_nav li {
    flex: 0 0 calc((100% - 16px) / 2);
    max-width: calc((100% - 16px) / 2);
    padding-top: 10px;
  }
}

/* button */
.job_search_nav-button {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  padding: 20px;
  color: var(--color-accent-red) !important;
  background: var(--color-white);
  border: 2px solid var(--color-accent-red);
  border-radius: 20px;
  font-weight: 700;
  text-align: center;
  position: relative;
  transition: var(--transition);
  line-height: 1.2;
}

.job_search_nav-button::after {
  content: "";
  position: absolute;
  left: 50%;
  top: -16px;
  transform: translateX(-50%);
  width: 30px;
  height: 16px;
  background: var(--color-accent-red);
  clip-path: polygon(50% 0, 0 100%, 100% 100%);
  opacity: 0;
  visibility: hidden;
  transition: var(--transition);
}

.job_search_nav-button[aria-pressed="true"] {
  color: var(--color-white) !important;
  background: var(--color-accent-red);
}

.job_search_nav-button[aria-pressed="true"]::after {
  opacity: 1;
  visibility: visible;
}

.job_search_nav-button em {
  font-size: 20px;
}

.job_search_nav-button .em-block {
  display: block;
}

.job_search_nav-button small {
  display: block;
  font-size: 14px;
}

@media (hover: hover) and (pointer: fine) {
  .job_search_nav-button:hover {
    opacity: var(--opacity);
    cursor: pointer;
  }
}

@media screen and (max-width: 767px) {
  .job_search_nav-button {
    min-height: 75px;
    padding: 2px 10px;
    border-radius: 12px;
  }

  .job_search_nav-button em {
    display: block;
    font-size: 18px;
  }

  .job_search_nav-button::after {
    width: 16px;
    height: 12px;
    top: -12px;
  }
}

/*****************************************
reason
*****************************************/
/* section */
.reason {
  background: var(--color-bg-orange);
}

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

/* list */
.reason_list {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
}

@media screen and (max-width: 767px) {
  .reason_list {
    grid-template-columns: 1fr;
    gap: 20px;
    margin-top: 32px;
  }
}

/* item */
.reason_item {
  background: var(--color-white);
  border-radius: 20px;
  margin-top: 32px;
  padding: 40px 20px 30px 20px;
  text-align: center;
  position: relative;
}

@media screen and (max-width: 767px) {
  .reason_item {
    padding: 35px 20px 30px;
    border-radius: 16px;
  }
}

/* number */
.reason_num {
  position: absolute;
  top: -35px;
  left: 8px;
  width: 70px;
  height: 70px;
  border-radius: 50%;
  background: var(--color-bg-yellow);
  display: flex;
  gap: 15px;
  font-family: "Josefin Sans";
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

@media screen and (max-width: 767px) {
  .reason_num {
    top: -45px;
    left: 50%;
    transform: translateX(-50%);
  }
}

/* number text */
.reason_num-text {
  color: var(--color-accent-red);
  font-family: "Josefin Sans";
  font-size: 12px;
  font-weight: 700;
}

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

/* number */
.reason_num-no {
  color: var(--color-accent-red);
  font-size: 40px;
  font-weight: 700;
  line-height: 0;
}

@media screen and (max-width: 767px) {
  .reason_num-no {
    font-size: 32px;
  }
}

/* title */
.reason_title {
  color: var(--color-accent-red);
  font-size: 20px;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
  line-height: 1.2;
}

@media screen and (max-width: 767px) {
  .reason_title {
    position: relative;
    display: block;
    text-align: center;
    padding: 0 70px;
  }

  .reason_title::before {
    content: "";
    width: 66px;
    height: 60px;
    aspect-ratio: 11/10;
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
  }

  .reason_item:nth-child(1) .reason_title::before {
    background: url("/jobfind-pc/original/images/icon_reason01.png") no-repeat center/contain;
  }

  .reason_item:nth-child(2) .reason_title::before {
    background: url("/jobfind-pc/original/images/icon_reason02.png") no-repeat center/contain;
  }

  .reason_item:nth-child(3) .reason_title::before {
    background: url("/jobfind-pc/original/images/icon_reason03.png") no-repeat center/contain;
  }

  .reason_item:nth-child(4) .reason_title::before {
    background: url("/jobfind-pc/original/images/icon_reason04.png") no-repeat center/contain;
  }

  .reason_title .accordionBtn_sp {
    width: 28px;
    height: 28px;
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
  }
}

/* sub */
.reason_sub {
  color: #3E519C;
  font-size: 14px;
  margin-top: 8px;
}

@media screen and (max-width: 767px) {
  .reason_sub {
    margin-top: 20px;
  }
}

.reason_sub span {
  display: inline-block;
}

.reason_sub span+span {
  margin-left: 8px;
}

/* icon */
.reason_icon {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-top: 20px;
}

.reason_icon img {
  width: 90px;
  height: auto;
}

@media screen and (max-width: 767px) {
  .reason_icon {
    display: none;
  }
}

/* text */
.reason_text {
  margin-top: 20px;
  text-align: left;
}

@media screen and (max-width: 767px) {
  .reason_text {
    margin-top: 16px;
  }
}

/*****************************************
work
*****************************************/
.work {
  background-color: var(--color-bg-orange);
}

/* work tab */
.work_tab {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 8px;
  padding: 0 48px;
}

@media screen and (max-width: 767px) {
  .work_tab {
    gap: 5px;
    padding: 0 22px;
  }
}

.work_tab.is-top {
  margin-bottom: -2px;
}

.work_tab.is-bottom {
  margin-top: -2px;
}

/* work tab item */
.work_tab li {
  display: flex;
}

/* work tab button */
.work_tab .work_tab-link {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  padding: 15px;
  color: var(--color-white);
  font-size: 20px;
  font-weight: 700;
  background: var(--color-accent-red);
  border: 2px solid var(--color-accent-red);
  cursor: pointer;
  transition: var(--transition);
}

.work_tab.is-top .work_tab-link {
  margin: 20px 0 8px;
  border-radius: 20px 20px 0 0;
}

.work_tab.is-bottom .work_tab-link {
  margin: 8px 0 20px;
  border-radius: 0 0 20px 20px;
}

@media screen and (max-width: 767px) {
  .work_tab .work_tab-link {
    padding: 4px;
    font-size: 16px;
  }

  .work_tab.is-top .work_tab-link {
    margin: 0 0 5px;
    border-radius: 15px 15px 0 0;
  }

  .work_tab.is-bottom .work_tab-link {
    margin: 5px 0 0;
    border-radius: 0 0 15px 15px;
  }
}

/* work tab active */
.work_tab .work_tab-link.is-active {
  margin: 0;
  color: var(--color-accent-red) !important;
  background: var(--color-white);
  border-color: var(--color-border);
  border-bottom-color: var(--color-white);
  position: relative;
  z-index: 2;
}

@media screen and (max-width: 767px) {
  .work_tab .work_tab-link.is-active {}
}

.work_tab.is-bottom .work_tab-link.is-active {
  border-top-color: var(--color-white);
  border-bottom-color: var(--color-border);
}

@media screen and (max-width: 767px) {
  .work_tab.is-bottom .work_tab-link.is-active {}
}

@media (hover: hover) and (pointer: fine) {
  .work_tab .work_tab-link:hover {
    opacity: var(--opacity);
  }
}

/* work contents */
.work_contents {
  position: relative;
  padding: 60px;
  background: var(--color-white);
  border: 2px solid var(--color-border);
  border-radius: 20px;
}

@media screen and (max-width: 767px) {
  .work_contents {
    padding: 30px 15px;
  }
}

/* work panel */
.work_search_workstyle {
  margin: auto;
}

.work_search_workstyle#work_panel_01 {
  max-width: 900px;
}

/* work head */
.work_head {
  margin-bottom: 40px;
  text-align: center;
}

@media screen and (max-width: 767px) {
  .work_head {
    margin-bottom: 32px;
  }
}

/* work head label */
.work_head-label {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 5px 28px;
  margin-bottom: 16px;
  background: #FFE8A9;
  border-radius: 999px;
  font-weight: 700;
  position: relative;
}

.work_head-label::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: -9px;
  transform: translateX(-50%);
  width: 0;
  height: 0;
  border-left: 6px solid transparent;
  border-right: 6px solid transparent;
  border-top: 10px solid #FFE8A9;
}

@media screen and (max-width: 767px) {
  .work_head-label {
    min-height: 24px;
    padding: 0 12px;
    margin-bottom: 12px;
    font-size: 16px;
  }
}

/* work head title */
.work_head-title {
  margin-bottom: 20px;
  font-size: 26px;
  font-weight: 700;
}

@media screen and (max-width: 767px) {
  .work_head-title {
    margin-bottom: 16px;
    font-size: 24px;
  }
}

/* work head text */
.work_head-text {
  max-width: 920px;
  margin: 0 auto;
  text-align: left;
}

@media screen and (max-width: 767px) {
  .work_head-text {
    max-width: none;
  }
}

/*anchor*/
.work_anchorList {
  margin-top: 40px;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 16px;
}

@media screen and (max-width: 767px) {
  .work_anchorList {
    margin-top: 30px;
    gap: 4px;
    align-items: center;
  }
}

/* anchor item */
.work_anchorList li {
  flex: 1;
  max-width: 368px;
}

@media screen and (max-width: 767px) {
  .work_anchorList li {
    flex: auto;
    max-width: none;
  }

  .work_anchorList li+li {
    margin-top: 0;
  }
}

/* anchor */
.work_anchor {
  display: inline-flex;
  min-height: 50px;
  padding: 0 40px;
  border-radius: 999px;
  font-size: 18px;
  font-weight: 700;
  text-align: center;
  text-decoration: none;
  border: 2px solid var(--color-accent-brown);
  transition: var(--transition);
  line-height: 1.2;
}

.work_anchor::after {
  margin-left: 0;
  content: "\E886";
  font-family: recop-iconfonts;
  position: absolute;
  top: 50%;
  right: 15px;
  transform: translateY(-50%);
}

.work_anchor:after,
.work_anchor span,
a.work_anchor:hover::after,
a.work_anchor:hover span {
  color: var(--color-accent-brown);
}

@media (hover: hover) and (pointer: fine) {
  .work_anchor:hover {
    opacity: var(--opacity);
  }
}

@media screen and (max-width: 767px) {
  .work_anchor {
    padding: 10px 20px 2px;
    flex-direction: column;
    font-size: 14px;
  }

  .work_anchor::after {
    position: relative;
    top: auto;
    right: auto;
    transform: none;
  }
}

.work_anchor.is-fulltime {
  border-color: var(--color-accent-brown);
  background-color: var(--color-bg-red);
}

.work_anchor.is-fulltime::after,
.work_anchor.is-fulltime span,
.work_anchor.is-fulltime:hover::after,
.work_anchor.is-fulltime:hover span {
  color: var(--color-accent-brown);
}

.work_anchor.is-part {
  border-color: var(--color-button-orange);
  background-color: var(--color-bg-orange);
}

.work_anchor.is-part::after,
.work_anchor.is-part span,
.work_anchor.is-part:hover::after,
.work_anchor.is-part:hover span {
  color: var(--color-button-orange);
}

/* work category */
.work_category {
  margin-top: 40px;
  padding: 40px 50px 60px;
  border-radius: 20px;
  border: 2px solid var(--color-border);
}

.work_category+.work_category {
  margin-top: 30px;
}

@media screen and (max-width: 767px) {
  .work_category {
    padding: 30px 10px 15px;
  }
}

/* work category head */
.work_category-head {
  margin-bottom: 30px;
  padding-bottom: 8px;
  border-bottom: 2px solid var(--color-border);
  text-align: center;
}

@media screen and (max-width: 767px) {
  .work_category-head {}
}

/* work category title */
.work_category-title {
  font-size: 24px;
  font-weight: 700;
}

@media screen and (max-width: 767px) {
  .work_category-title {
    font-size: 22px;
  }
}

/* work card */
.work_card {
  padding: 40px 50px 60px;
  border-radius: 20px;
  background: var(--color-white);
}

.work_card+.work_card {
  margin-top: 30px;
}

@media screen and (max-width: 767px) {
  .work_card {
    padding: 30px 10px;
  }
}

.work_card-body+.work_card-body {
  margin-top: 60px;
  padding-top: 60px;
  border-top: 2px solid var(--color-border);
}

@media screen and (max-width: 767px) {
  .work_card-body+.work_card-body {
    margin-top: 30px;
    padding-top: 30px;
  }
}

/* work card title */
.work_card-title {
  margin-bottom: 30px;
  text-align: center;
  font-size: 22px;
  font-weight: 700;
  position: relative;
}

@media screen and (max-width: 767px) {
  .work_card-title {
    margin-bottom: 20px;
    font-size: 20px;
  }
}

.work_card-title span {
  display: inline-block;
  padding-bottom: 8px;
  border-bottom: 3px solid var(--color-accent-red);
}

/* work card body */
.work_category.is-fulltime,
.work_card.is-fulltime {
  border-color: var(--color-bg-red);
  background-color: var(--color-bg-red);
}

.work_category.is-part,
.work_card.is-part {
  border-color: var(--color-bg-orange);
  background-color: var(--color-bg-orange);
}

/* work media */
.work_media {
  display: flex;
  align-items: center;
  gap: 50px;
}

@media screen and (max-width: 767px) {
  .work_media {
    flex-direction: column;
    gap: 20px;
  }
}

.work_media-content {
  flex: 1;
}

.work_media-image {
  flex: 0 1 28%;
  max-width: 280px;
}

/* work media text */
.work_media-text {
  padding: 0 10px;
}

/* work media image */
.work_media-image img {
  display: block;
  width: 100%;
  height: auto;
}

@media screen and (max-width: 767px) {
  .work_media-image img {
    max-width: 320px;
    margin: 0 auto;
  }
}

/* work schedule */
.work_schedule-wrap {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 36px;
}

@media screen and (max-width: 767px) {
  .work_schedule-wrap {
    grid-template-columns: 1fr;
    gap: 0;
  }
}

/* work schedule item */
.work_schedule-type {
  font-size: 22px;
  font-weight: bold;
  margin-bottom: 20px;
}

@media screen and (max-width: 767px) {
  .work_schedule-type {
    font-size: 16px;
    text-align: center;
  }
}

.work_schedule-item {
  display: grid;
  grid-template-columns: 58px 1fr;
  column-gap: 20px;
  padding-bottom: 30px;
  position: relative;
}

@media screen and (max-width: 767px) {
  .work_schedule-item {
    grid-template-columns: 48px 1fr;
    column-gap: 10px;
    padding-bottom: 24px;
  }
}

.work_schedule-item::before {
  content: "";
  position: absolute;
  top: 0;
  left: 28px;
  width: 2px;
  height: 100%;
  background: var(--color-accent-red);
}

@media screen and (max-width: 767px) {
  .work_schedule-item::before {
    left: 22px;
  }
}

.work_schedule-item.is-only {
  align-items: center;
}

.work_schedule-item.is-finished {
  padding-bottom: 0;
}

.work_schedule-item.is-finished::before {
  content: none;
}

.work_schedule-time {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 58px;
  height: 58px;
  color: var(--color-white);
  font-weight: 700;
  background: var(--color-accent-red);
  border-radius: 50%;
  position: relative;
  z-index: 1;
}

@media screen and (max-width: 767px) {
  .work_schedule-time {
    width: 48px;
    height: 48px;
    font-size: 14px;
  }
}

.work_schedule-title {
  font-size: 18px;
  font-weight: 700;
}

@media screen and (max-width: 767px) {
  .work_schedule-title {
    font-size: 16px;
  }
}

.work_schedule-img {
  margin-top: 16px;
}

@media screen and (max-width: 767px) {
  .work_schedule-img {
    margin-top: 8px;
  }
}

/*****************
店舗
********************/
/* work feature */
.work_feature {
  margin-top: 40px;
  display: grid;
  grid-template-columns: 1fr 220px;
  align-items: center;
  gap: 20px;
  padding: 40px 60px;
  border: 1px solid var(--color-border);
  border-radius: 20px;
  background-color: #FAFAFA;
  position: relative;
}

@media screen and (max-width: 767px) {
  .work_feature {
    grid-template-columns: 1fr;
    gap: 8px;
    padding: 30px 24px;
    border-radius: 16px;
  }
}

/* work feature label */
.work_feature-label {
  display: inline-flex;
  position: absolute;
  top: -15px;
  align-items: center;
  justify-content: center;
  padding: 2px 27px;
  color: var(--color-white);
  background: #109C89;
  border-radius: 999em;
}

.work_feature-label::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: -5px;
  transform: translateX(-50%);
  width: 0;
  height: 0;
  border-left: 6px solid transparent;
  border-right: 6px solid transparent;
  border-top: 6px solid #109C89;
}

/* work feature title */
.work_feature-title {
  margin-bottom: 16px;
  font-size: 20px;
  font-weight: 700;
  color: var(--color-primary);
  line-height: 1.3;
}

@media screen and (max-width: 767px) {
  .work_feature-title {
    margin-bottom: 8px;
  }
}

/* work feature btn list */
.work_feature-btnList {
  margin-top: 28px;
}

@media screen and (max-width: 767px) {
  .work_feature-btnList {
    margin-top: 20px;
  }
}

.work_feature-btnList .c-btn {
  max-width: none;
  width: auto;
  display: inline-block;
  padding: 8px 40px 8px 34px;
}

@media screen and (max-width: 767px) {
  .work_feature-btnList li {
    text-align: center;
  }
}

/* work feature image */
.work_feature-image {
  display: flex;
  align-items: center;
  justify-content: center;
  max-width: 220px;
  position: absolute;
  right: 40px;
  top: 50%;
  transform: translateY(-50%);
}

@media screen and (max-width: 767px) {
  .work_feature-image {
    max-width: 200px;
    margin: auto;
    position: static;
    transform: none;
  }
}

/* work job */
.work_job {
  border-top: 1px solid var(--color-border);
}

.work_job:last-child {
  border-bottom: 1px solid var(--color-border);
}

@media screen and (max-width: 767px) {
  .work_job {}
}

/* work job trigger */
.work_job-trigger {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  padding: 24px 0;
  background: none;
  border: none;
  cursor: pointer;
  text-align: left;
}

@media screen and (max-width: 767px) {
  .work_job-trigger {
    padding: 20px 0;
  }
}

/* work job title */
.work_job-title {
  display: flex;
  align-items: center;
  font-size: 20px;
  font-weight: 700;
  gap: 12px;
}

.work_job-title::before {
  content: "";
  width: 16px;
  height: 2px;
  background: var(--color-accent-red);
}

@media screen and (max-width: 767px) {
  .work_job-title {}

  .work_job-title::before {
    width: 10px;
    margin-right: 10px;
  }
}

/* work job trigger icon */
.work_job-trigger::after {
  content: "";
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background: var(--color-button-gray);
  position: relative;
  flex-shrink: 0;
  background-image:
    linear-gradient(var(--color-white), var(--color-white)),
    linear-gradient(var(--color-white), var(--color-white));
  background-size: 12px 2px, 2px 12px;
  background-position: center;
  background-repeat: no-repeat;
  transition: var(--transition);
}

@media screen and (max-width: 767px) {
  .work_job-trigger::after {
    width: 20px;
    height: 20px;
    background-size: 10px 2px, 2px 10px;
  }
}

.work_job-trigger[aria-expanded="true"]::after {
  background-image:
    linear-gradient(var(--color-white), var(--color-white));
  background-size: 12px 2px;
}

@media screen and (max-width: 767px) {
  .work_job-trigger[aria-expanded="true"]::after {
    background-size: 10px 2px;
  }
}

/* work job panel */
.work_job-panel {
  padding-bottom: 24px;
}

@media screen and (max-width: 767px) {
  .work_job-panel {
    padding-bottom: 20px;
  }
}

@media (hover: hover) and (pointer: fine) {
  .work_job-trigger:hover {
    opacity: var(--opacity);
  }
}

/* work job content */
.work_job-content {
  display: flex;
  flex: 0 1 34.1%;
  gap: 20px;
  align-items: start;
}

@media screen and (max-width: 767px) {
  .work_job-content {
    flex-direction: column;
    gap: 20px;
  }
}

/* work job image */
.work_job-image {
  max-width: 300px;
  margin: 0 auto;
}

.work_job-image img {
  display: block;
  width: 100%;
  height: auto;
}

@media screen and (max-width: 767px) {
  .work_job-image {
    max-width: 200px;
  }
}

/* work job detail */
.work_job-detail {
  flex: 1;
}

@media screen and (max-width: 767px) {
  .work_job-detail {}
}

/* work job text */
.work_job-text {
  margin-bottom: 24px;
}

@media screen and (max-width: 767px) {
  .work_job-text {
    margin-bottom: 20px;
  }
}

/* work job recruit */
.work_job-recruit {
  padding: 20px;
  background: var(--color-bg-navy);
  border-radius: 999px;
}

@media screen and (max-width: 767px) {
  .work_job-recruit {
    padding: 20px 10px;
    border-radius: 20px;
  }
}

.work_job-recruit-title {
  margin-bottom: 16px;
  text-align: center;
  font-size: 18px;
  font-weight: 700;
}

@media screen and (max-width: 767px) {
  .work_job-recruit-title {
    margin-bottom: 14px;
    font-size: 18px;
  }
}

.work_job-btnList {
  max-width: 496px;
  margin: auto;
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 8px;
}

/* work job button item */
.work_job-btnList li {
  flex: 1;
  max-width: calc((100% - 16px)/3);
}

.work_job-btnList .c-btn {
  padding: 8px 20px;
}

.work_job-btnList .c-btn.is-part {
  border-color: var(--color-button-orange);
  background-color: var(--color-button-orange);
}

.work_job-btnList .c-btn.is-student {
  border-color: var(--color-button-green);
  background-color: var(--color-button-green);
}

.work_job-btnList .c-btn.is-fulltime {
  border-color: var(--color-accent-brown);
  background-color: var(--color-accent-brown);
}

@media (hover: hover) and (pointer: fine) {

  .work_job-btnList .c-btn:hover span,
  .work_job-btnList .c-btn:hover::after {
    color: var(--color-white);
  }

  .work_job-btnList .c-btn:hover {
    opacity: var(--opacity);
  }
}

@media screen and (max-width: 1020px) {
  .work_job-btnList .c-btn {
    min-height: 55px;
    padding: 0;
  }

  .work_job-btnList .c-btn::after {
    position: relative;
    top: auto;
    right: auto;
    transform: none;
    line-height: 1;
  }

  .work_job-btnList .c-btn .sp {
    display: block;
  }
}

@media screen and (max-width: 920px) {
  .work_job-btnList .c-btn {
    font-size: 14px;
  }
}

/* work job list */
.work_jobList {}

@media screen and (max-width: 767px) {
  .work_jobList {}
}

/* work job item */
.work_jobItem+.work_jobItem {
  margin-top: 30px;
  padding-top: 30px;
  border-top: 2px solid var(--color-border);
}

/* work job item title */
.work_jobItem-title {
  margin-bottom: 16px;
  display: flex;
  align-items: center;
  font-size: 20px;
  font-weight: 700;
  gap: 12px;
}

.work_jobItem-title::before {
  content: "";
  width: 16px;
  height: 2px;
  background: var(--color-accent-red);
}

@media screen and (max-width: 767px) {
  .work_jobItem-title {
    font-size: 18px;
  }
}

/* work job item content */
.work_jobItem-content {
  display: flex;
  align-items: flex-start;
  gap: 30px;
  align-items: start;
}

@media screen and (max-width: 767px) {
  .work_jobItem-content {
    flex-direction: column;
    gap: 16px;
  }
}

/* work job item image */
.work_jobItem-image {
  flex: 0 1 34.5%;
  max-width: 300px;
}

.work_jobItem-image img {
  display: block;
  width: 100%;
  height: auto;
}

@media screen and (max-width: 767px) {
  .work_jobItem-image {
    max-width: 300px;
    margin: auto;
  }
}

/* work job item detail */
.work_jobItem-detail {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  height: 100%;
  gap: 24px;
}

/* work job item button list */
.work_jobItem-btnList {}

.work_jobItem-btnList .c-btn {
  padding: 15px 20px;
  max-width: 260px;
}

@media screen and (max-width: 767px) {
  .work_jobItem-btnList .c-btn {
    margin: auto;
  }
}

/* work category note */
.work_category-noteList {
  margin-top: 60px;
}

@media screen and (max-width: 767px) {
  .work_category-noteList {
    margin-top: 30px;
  }
}

.work_category-note {
  margin-bottom: 10px;
  text-align: center;
  color: #555555;
}

@media screen and (max-width: 767px) {
  .work_category-note {
    text-align: left;
  }
}

.work_category-anchor {
  text-align: center;
}

/* work category button list */
.work_category-btnList {
  margin-top: 30px;
  display: flex;
  justify-content: center;
  gap: 15px;
}

.work_category-noteList+.work_category-btnList {
  margin-top: 60px;
}

@media screen and (max-width: 767px) {
  .work_category-noteList+.work_category-btnList {
    margin-top: 30px;
  }
}

.work_category-btnList li {
  max-width: 368px;
  width: 100%;
}

@media screen and (max-width: 767px) {
  .work_category-btnList {
    flex-direction: column;
  }

  .work_category-btnList li {
    margin: auto;
  }
}

.work_category-btnList .c-btn {
  min-height: 70px;
  font-size: 18px;
  border-color: var(--color-accent-brown);
  border-width: 2px;
  background-color: var(--color-accent-brown);
}

@media (hover: hover) and (pointer: fine) {
  .work_category-btnList a.c-btn:hover {
    background-color: var(--color-accent-brown);
    opacity: var(--opacity);
  }

  .work_category-btnList a.c-btn:hover::after,
  .work_category-btnList a.c-btn:hover span {
    color: var(--color-white);
  }
}

@media screen and (max-width: 767px) {
  .work_category-btnList .c-btn {
    font-size: 16px;
  }
}

.work_category-btnList .c-btn-anchor {
  background-color: var(--color-white);
}

.work_category-btnList .c-btn-anchor::after,
.work_category-btnList .c-btn-anchor span {
  color: var(--color-accent-brown);
}

.work_category-btnList .c-btn-anchor::after {
  content: "\E886";
}

@media (hover: hover) and (pointer: fine) {
  .work_category-btnList a.c-btn-anchor:hover {
    background-color: var(--color-white);
    opacity: var(--opacity);
  }

  .work_category-btnList a.c-btn-anchor:hover::after,
  .work_category-btnList a.c-btn-anchor:hover span {
    color: var(--color-accent-brown);
  }

}

/*****************
物流
********************/
/* work shift */
.work_shift+.work_shift {
  margin-top: 40px;
  padding-top: 40px;
  border-top: 2px solid var(--color-border);
}

@media screen and (max-width: 767px) {
  .work_shift+.work_shift {
    margin-top: 40px;
    padding-top: 40px;
  }
}

/* work shift title */
.work_shift-title {
  margin-bottom: 40px;
  text-align: center;
  font-size: 18px;
  font-weight: 700;
  color: var(--color-primary);
  line-height: 1.2;
}

@media screen and (max-width: 767px) {
  .work_shift-title {
    margin-bottom: 20px;
    font-size: 22px;
  }
}

/* work shift week */
.work_shift-week {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 10px;
  margin-bottom: 30px;
}

@media screen and (max-width: 767px) {
  .work_shift-week {
    grid-template-columns: repeat(1, 1fr);
    padding-left: 24px;
  }
}

/* work shift day */
.work_shift-day {
  position: relative;
  padding: 28px 10px 20px;
  text-align: center;
  background: var(--color-bg-orange);
  border: 1px solid var(--color-border);
  border-radius: 16px;
  display: flex;
  align-items: center;
  justify-content: center;
}

@media screen and (max-width: 767px) {
  .work_shift-day {
    padding: 15px 30px;
    border-radius: 999em;
  }
}

.work_shift-day.is-holiday {
  background: var(--color-bg-navy);
}

.work_shift-day.is-off {
  background: var(--color-bg-red);
}


/* work shift weekday */
.work_shift-weekday {
  position: absolute;
  top: -16px;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  align-items: center;
  justify-content: center;
  width: 38px;
  height: 38px;
  color: var(--color-white);
  font-weight: 700;
  background: var(--color-button-navy);
  border-radius: 50%;
}

@media screen and (max-width: 767px) {
  .work_shift-weekday {
    left: -24px;
    top: 50%;
    transform: translate(0, -50%);
  }
}

/* work shift comment */
.work_shift-comment {
  max-width: 620px;
  margin: auto;
  display: grid;
  grid-template-columns: 1fr 80px;
  align-items: end;
  gap: 20px;
}

@media screen and (max-width: 1230px) {
  .work_shift-comment {
    grid-template-columns: 1fr;
    gap: 24px;
  }
}

/* work shift balloon */
.work_shift-balloon {
  position: relative;
  padding: 30px 50px;
  background: url("/jobfind-pc/original/images/bg_balloon.png") no-repeat center / 100% 100%;
}

@media screen and (max-width: 1230px) {
  .work_shift-balloon {
    padding: 20px 30px;
    border-radius: 24px;
    background: #fff;
    border-radius: 60px;
    border: 2px solid var(--color-border);
  }

  .work_shift-balloon::before {
    content: "";
    position: absolute;
    left: 50%;
    bottom: -13px;
    transform: translateX(-50%);
    border-style: solid;
    border-width: 13px 12px 0;
    border-color: var(--color-border) transparent transparent;
  }

  .work_shift-balloon::after {
    content: "";
    position: absolute;
    left: 50%;
    bottom: -10px;
    transform: translateX(-50%);
    border-style: solid;
    border-width: 12px 11px 0;
    border-color: var(--color-white) transparent transparent;
  }

  .work_shift-person {
    margin: auto;
    width: 80px;
  }
}


/*****************
その他
********************/
.workstyle_other .work_anchorList li {
  flex: none;
}

.workstyle_other .work_anchor {
  background-color: var(--color-white);
}

@media (hover: hover) and (pointer: fine) {

  .workstyle_other a.work_anchor:hover::after,
  .workstyle_other a.work_anchor:hover span {
    color: var(--color-accent-brown);
  }
}

.workstyle_other-lead {
  margin-bottom: 30px;
  text-align: center;
}

.work_card-tagList {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 4px;
  margin-bottom: 30px;
}

.work_card-tag {
  padding: 0 15px;
  color: #3E519C;
  background: var(--color-white);
  border: 1px solid var(--color-border);
  border-radius: 999px;
}

.work_jobItem-content_other {
  display: flex;
  gap: 24px;
  align-items: flex-end;
}

.work_jobItem-content_other .work_jobItem-text {
  flex: 1;
}

.work_jobItem-content_other .work_jobItem-btnList {
  flex-shrink: 0;
  width: 260px;
}

@media screen and (max-width: 1230px) {
  .work_jobItem-content_other {
    flex-direction: column;
    gap: 30px;
  }

  .work_jobItem-content_other .work_jobItem-btnList {
    width: 100%;
  }

}

/* work gallery */
.work_gallery {
  margin-top: 40px;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 10px;
}

@media screen and (max-width: 767px) {
  .work_gallery {
    flex-direction: column;
  }
}

.work_gallery-item {
  flex: 0 1 260px;
  max-width: 260px;
  width: 100%;
}

@media screen and (max-width: 767px) {
  .work_gallery-item {
    flex: none;
    max-width: none;
  }
}

.work_gallery-figure img {
  display: block;
  width: 100%;
  height: auto;
}

.work_gallery-caption {
  margin-top: 10px;
  font-size: 15px;
}

.work_jobItem-btnList_other {
  margin-top: 60px;
}

@media screen and (max-width: 767px) {
  .work_jobItem-btnList_other {
    margin-top: 30px;
  }
}

.work_jobItem-btnList_other .c-btn {
  margin: auto;
  padding: 15px 20px;
  max-width: 260px;
}

/*****************************************
interview
*****************************************/
.interview .l-sec_inner {
  max-width: 1030px;
}

@media screen and (max-width: 767px) {
  .interview .l-sec_heading-icon {
    left: 0;
    top: -70px;
  }
}

/* interview filter */
.interview_filter {
  position: relative;
  padding: 20px 30px;
  background: var(--color-bg-navy);
  border-radius: 999px;
}

@media screen and (max-width: 767px) {
  .interview_filter {
    padding: 20px;
    border-radius: 20px;
  }
}

/* interview filter title */
.interview_filter-titleWrap {
  margin-bottom: 16px;
  position: relative;
}

@media screen and (max-width: 767px) {
  .interview_filter-titleWrap {
    display: flex;
    gap: 20px;
    align-items: center;
    justify-content: center;
  }
}

.interview_filter-title {
  text-align: center;
  font-size: 20px;
  font-weight: 700;
  color: var(--color-text);
}

@media screen and (max-width: 767px) {
  .interview_filter-title {
    text-align: left;
  }
}

/* interview filter list */
.interview_filter-list {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 6px;
}

@media screen and (max-width: 767px) {
  .interview_filter-list {
    justify-content: flex-start;
    gap: 8px 6px;
    padding: 0;
  }
}

/* interview filter list item */
.interview_filter-list li {}

@media screen and (max-width: 767px) {
  .interview_filter-list li {}
}

/* interview filter button */
.interview_filter-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 74px;
  height: 30px;
  padding: 0 14px;
  color: var(--color-accent-red);
  font-weight: 700;
  background: var(--color-white);
  border: 1px solid var(--color-accent-red);
  border-radius: 999px;
  cursor: pointer;
  transition: var(--transition);
}

.interview_filter-btn.is-active {
  color: var(--color-white);
  background: var(--color-accent-red);
}

@media (hover: hover) and (pointer: fine) {
  .interview_filter-btn:hover {
    opacity: var(--opacity);
  }
}

/* interview filter clear */
.interview_filter-clear {
  position: absolute;
  top: 50%;
  right: 0;
  transform: translateY(-50%);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 58px;
  height: 26px;
  padding: 6px 20px;
  color: var(--color-white);
  background: var(--color-button-navy);
  border: none;
  border-radius: 999px;
  cursor: pointer;
  transition: var(--transition);
}

@media screen and (max-width: 767px) {
  .interview_filter-clear {
    position: static;
    transform: none;
  }
}

@media (hover: hover) and (pointer: fine) {
  .interview_filter-clear:hover {
    opacity: var(--opacity);
  }
}

/* interview card */
.interview_card-wrap {
  margin-top: 30px;
}

.interview_card {
  display: block;
  width: 100%;
  padding: 40px;
  background: var(--color-bg-orange);
  border-radius: 20px;
  text-align: left;
  position: relative;
  cursor: pointer;
  box-shadow: 10px 10px 0 var(--color-bg-navy);
}

@media screen and (max-width: 767px) {
  .interview_card {
    padding: 30px;
  }
}

@media (hover: hover) and (pointer: fine) {
  .interview_card:hover {
    opacity: var(--opacity);
  }
}

/* interview card item */
.interview_card-item {
  display: grid;
  grid-template-columns: 288px 1fr;
  gap: 30px;
}

@media screen and (max-width: 767px) {
  .interview_card-item {
    grid-template-columns: 1fr;
    gap: 16px;
  }
}

.interview_card-image img {
  display: block;
  width: 100%;
  height: auto;
}

@media screen and (max-width: 767px) {
  .interview_card-image {
    max-width: 320px;
    margin: auto;
  }
}

.interview_card-tagList {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  margin-bottom: 20px;
}

/* interview card tag */
.interview_card-tag {
  padding: 0 15px;
  color: #3E519C;
  background: var(--color-white);
  border: 1px solid var(--color-border);
  border-radius: 999px;
}

/* interview card title */
.interview_card-title {
  margin-bottom: 13px;
  padding-bottom: 13px;
  font-size: 26px;
  font-weight: 700;
  position: relative;
}

.interview_card-title::before {
  content: "";
  width: 24px;
  height: 3px;
  background-color: var(--color-accent-red);
  position: absolute;
  left: 0;
  bottom: 0;
}

@media screen and (max-width: 767px) {
  .interview_card-title {
    font-size: 22px;
  }

  .interview_card-title span {
    display: inline-block;
  }
}

.interview_card-name {
  font-weight: 700;
}

/* interview card plus */
.interview_card-plus {
  position: absolute;
  right: 0;
  bottom: 0;
  width: 87px;
  height: 87px;
  background: var(--color-accent-orange);
  clip-path: polygon(100% 0, 100% 100%, 0 100%);
  border-bottom-right-radius: 20px;
}

.interview_card-plus::before,
.interview_card-plus::after {
  content: "";
  position: absolute;
  background: var(--color-white);
  right: 16px;
  bottom: 26px;
  width: 20px;
  height: 3px;
}

.interview_card-plus::after {
  transform: rotate(90deg);
}


.interview .modal_container {
  background-color: var(--color-bg-orange);
  box-shadow: 10px 10px 0 var(--color-button-gray);
}

@media screen and (min-width: 768px) {
  .interview .modal_body {
    padding: 30px;
  }
}

.interview_detail-head {
  position: relative;
}

/* interview detail image */
.interview_detail-image {
  max-width: 600px;
}

@media screen and (max-width: 920px) {
  .interview_detail-image {
    max-width: 100%;
  }
}

.interview_detail-image img {
  display: block;
  width: 100%;
  height: auto;
}

/* interview detail content */
.interview_detail-content {
  max-width: 440px;
  width: 100%;
  padding: 20px 30px;
  padding-right: 0;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  background-color: var(--color-bg-orange);
}

@media screen and (max-width: 920px) {
  .interview_detail-content {
    position: static;
    max-width: 100%;
    transform: none;
    padding: 20px 0 0;
  }
}

.interview_detail-tagList {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  margin-bottom: 20px;
}

.interview_detail-tag {
  padding: 0 15px;
  color: #3E519C;
  background: var(--color-white);
  border: 1px solid var(--color-border);
  border-radius: 999px;
}

.interview_detail-title {
  margin-bottom: 13px;
  padding-bottom: 13px;
  font-size: 26px;
  font-weight: 700;
  position: relative;
}

.interview_detail-title::before {
  content: "";
  width: 24px;
  height: 3px;
  background-color: var(--color-accent-red);
  position: absolute;
  left: 0;
  bottom: 0;
}

.interview_detail-title span {
  display: inline-block;
}

@media screen and (max-width: 767px) {
  .interview_detail-title {
    font-size: 22px;
  }
}

.interview_detail-name {
  font-weight: 700;
}

/* interview detail section */
.interview_detail-section {
  margin-top: 60px;
  display: grid;
  grid-template-columns: 1fr 288px;
  column-gap: 30px;
}

@media screen and (max-width: 767px) {
  .interview_detail-section {
    margin-top: 40px;
    grid-template-columns: 1fr;
    row-gap: 20px;
  }

  .interview_detail-section_image {
    max-width: 320px;
    margin: auto;
    padding: 0 20px;
  }
}

/* interview detail section reverse */
.interview_detail-section-reverse {
  grid-template-columns: 288px 1fr;
}

.interview_detail-section-reverse .interview_detail-section_content {
  order: 2;
}

.interview_detail-section-reverse .interview_detail-section_image {
  order: 1;
}

@media screen and (max-width: 767px) {
  .interview_detail-section-reverse {
    grid-template-columns: 1fr;
  }

  .interview_detail-section-reverse .interview_detail-section_content,
  .interview_detail-section-reverse .interview_detail-section_image {
    order: initial;
  }
}

/* interview detail heading */
.interview_detail-heading {
  margin-bottom: 16px;
  color: var(--color-primary);
  font-size: 20px;
  font-weight: 700;
}

.interview_detail-section_image img {
  display: block;
  width: 100%;
  height: auto;
}

/* interview schedule */
.interview_schedule {
  margin-top: 60px;
  padding: 40px 20px 60px;
  background: var(--color-white);
  border-radius: 20px;
}

.interview_schedule-inner {
  margin: auto;
  text-align: center;
}

@media screen and (max-width: 767px) {
  .interview_schedule {
    margin-top: 40px;
    padding: 30px 15px;
  }
}

/* interview schedule title */
.interview_schedule-title {
  display: inline-block;
  position: relative;
  margin: auto;
  margin-bottom: 30px;
  padding-bottom: 8px;
  text-align: center;
  font-size: 22px;
  font-weight: 700;
  border-bottom: 3px solid var(--color-accent-red);
}

@media screen and (max-width: 767px) {
  .interview_schedule-title {
    font-size: 18px;
  }
}

.interview_schedule-list {
  display: grid;
  gap: 16px;
  max-width: 390px;
  margin: auto;
}

.interview_schedule-item {
  display: grid;
  grid-template-columns: 70px 1fr;
  column-gap: 16px;
  text-align: left;
  align-items: flex-start;
  position: relative;
}

.interview_schedule-item:not(:last-child)::before {
  content: "";
  width: 2px;
  height: 100%;
  background-color: var(--color-button-navy);
  bottom: -27px;
  left: 34px;
  position: absolute;
}

@media screen and (max-width: 767px) {
  .interview_schedule-item {
    gap: 10px;
    grid-template-columns: 60px 1fr;
  }

  .interview_schedule-item:not(:last-child)::before {
    left: 28px;
  }
}

/* interview schedule time */
.interview_schedule-time {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  color: var(--color-white);
  font-weight: 700;
  background: #6d79b2;
  border-radius: 999px;
}

@media screen and (max-width: 767px) {
  .interview_schedule-time {}
}

/* btn */
.interview_detail-btnList {
  max-width: 400px;
  width: 100%;
  margin: 60px auto 0;
  color: var(--color-white);
}

.interview_detail-btnList .c-btn {
  display: flex;
  justify-content: center;
  align-items: center;
  min-height: 50px;
  padding: 0 30px;
  border-radius: 999px;
  font-weight: 700;
  text-align: center;
  text-decoration: none;
  position: relative;
  border: 2px solid var(--color-accent-red);
  background-color: var(--color-accent-red);
  transition: var(--transition);
  line-height: 1.2;
}

.interview_detail-btnList .c-btn::after {
  margin-left: 0;
  content: "\E885";
  font-family: recop-iconfonts;
  position: absolute;
  top: 50%;
  right: 20px;
  transform: translateY(-50%);
}

/*****************************************
support
*****************************************/
.support {
  margin-top: 80px;
}

@media screen and (max-width: 767px) {
  .support {
    margin-top: 60px;
  }
}

/* heading */
.support_contents-heading {
  text-align: center;
}

@media screen and (max-width: 767px) {
  .support_contents-heading {}
}

/* sub */
.support_contents-sub {
  margin-bottom: 10px;
  font-weight: 700;
}

.support_contents-sub span {
  display: inline-block;
  font-size: 18px;
  padding: 0 10px;
  position: relative;
}

.support_contents-sub span::before,
.support_contents-sub span::after {
  content: "";
  width: 20px;
  height: 1px;
  background: var(--color-text);
  position: absolute;
  bottom: 5px;
}

.support_contents-sub span::before {
  left: 0;
  transform: translate(-100%, -50%) rotate(45deg);
  transform-origin: right center;
}

.support_contents-sub span::after {
  right: 0;
  transform: translate(100%, -50%) rotate(-45deg);
  transform-origin: left center;
}

/* title */
.support_contents-title {
  font-size: 26px;
  font-weight: 700;
}

@media screen and (max-width: 767px) {
  .support_contents-title {
    font-size: 22px;
  }
}

/* lead */
.support_contents-lead {
  margin-top: 24px;
}

@media screen and (max-width: 767px) {
  .support_contents-lead {
    text-align: left;
  }
}

/* support card item */
.support_card-list {
  max-width: 900px;
  margin: auto;
}

.support_card-wrap {
  margin-top: 40px;
}

.support_card {
  width: 100%;
}

.support_card-item {
  position: relative;
  padding: 44px 28px 24px 60px;
  border: 1px solid var(--color-border);
  border-radius: 20px;
  background: var(--color-white);
}

@media screen and (max-width: 767px) {
  .support_card-item {
    padding: 30px;
  }
}

.support_card-inner {
  display: grid;
  grid-template-columns: 1fr 220px;
  column-gap: 20px;
}

@media screen and (max-width: 767px) {
  .support_card-inner {
    grid-template-columns: 1fr;
    row-gap: 20px;
  }
}

.support_card-label {
  position: relative;
  display: inline-flex;
  position: absolute;
  top: -15px;
}

.support_card-label span {
  align-items: center;
  justify-content: center;
  padding: 2px 27px;
  color: var(--color-white);
  background: #109C89;
  border-radius: 999em;
}

.support_card-label span::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: -5px;
  transform: translateX(-50%);
  width: 0;
  height: 0;
  border-left: 6px solid transparent;
  border-right: 6px solid transparent;
  border-top: 6px solid #109C89;
}

.support_card-title {
  margin-bottom: 16px;
  color: var(--color-primary);
  font-size: 20px;
  font-weight: 700;
}

/* support card text */
.support_card-text {
  color: var(--color-text);
}

@media screen and (max-width: 767px) {
  .support_card-text {}
}

/* support card image */
.support_card-image {
  display: flex;
  justify-content: center;
}

.support_card-image img {
  display: block;
  width: 100%;
  height: auto;
}

/* support card plus */
.support_card-plus {
  position: absolute;
  right: 0;
  bottom: 0;
  width: 87px;
  height: 87px;
  background: var(--color-accent-orange);
  clip-path: polygon(100% 0, 100% 100%, 0 100%);
  border-bottom-right-radius: 20px;
}

.support_card-plus::before,
.support_card-plus::after {
  content: "";
  position: absolute;
  background: var(--color-white);
  right: 16px;
  bottom: 26px;
  width: 20px;
  height: 3px;
}

.support_card-plus::after {
  transform: rotate(90deg);
}

/*****************************************
support detail
*****************************************/
.support_detail-head {
  display: grid;
  grid-template-columns: 1fr 320px;
  gap: 30px;
}

@media screen and (max-width: 767px) {
  .support_detail-head {
    grid-template-columns: 1fr;
    gap: 20px;
    margin-bottom: 32px;
  }
}

/* support detail label */
.support_detail-label {
  margin-bottom: 16px;
}

.support_detail-label span {
  padding: 10px 35px;
  color: var(--color-white);
  background: #109C89;
  font-weight: 700;
  border-radius: 999em;
  position: relative;
}

.support_detail-label span::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: -9px;
  transform: translateX(-50%);
  border-top: 10px solid #109C89;
  border-right: 6px solid transparent;
  border-left: 6px solid transparent;
}

@media screen and (max-width: 767px) {
  .support_detail-label {
    text-align: center;
  }

  .support_detail-label span {
    padding: 5px 27px;
  }
}

.support_detail-title {
  margin-bottom: 20px;
  color: var(--color-primary);
  font-size: 24px;
  font-weight: 700;
}

@media screen and (max-width: 767px) {
  .support_detail-title {
    text-align: center;
    font-size: 22px;
  }
}

/* support detail image */
.support_detail-image img {
  display: block;
  width: 100%;
  height: auto;
}

/* support detail section */
.support_detail-section {
  margin-top: 30px;
}

@media screen and (max-width: 767px) {
  .support_detail-section {
    margin-top: 24px;
  }
}

/* support detail heading */
.support_detail-heading {
  margin-bottom: 15px;
  padding-bottom: 10px;
  color: var(--color-primary);
  font-size: 20px;
  font-weight: 700;
  border-bottom: 2px solid var(--color-border);
}

/* support detail sub */
.support_detail-subsection+.support_detail-subsection {
  margin-top: 30px;
}

.support_detail-subheading {
  margin-bottom: 8px;
  font-size: 18px;
  font-weight: 700;
  color: var(--color-text);
}

@media screen and (max-width: 767px) {
  .support_detail-heading {
    text-align: center;
  }
}

.support_detail-info {
  display: flex;
}

.support_detail-info {
  margin-top: 10px;
}

.support_detail-info dt {
  font-weight: 700;
  min-width: 3rem;
}

/* support feature list */
.support_feature-list {
  display: grid;
  gap: 20px;
}

.support_feature-item {
  display: grid;
  grid-template-columns: 34px 1fr;
  gap: 15px;
}

@media screen and (max-width: 767px) {
  .support_feature-item {
    display: grid;
    grid-template-columns: 34px 1fr;
    gap: 15px;
  }
}

/* support feature num */
.support_feature-num {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  color: var(--color-white);
  font-family: "Josefin Sans";
  font-size: 30px;
  font-weight: 700;
  background: var(--color-accent-red);
  border-radius: 50%;
  padding-top: 4px;
}

/* support feature title */
.support_feature-title {
  margin-bottom: 16px;
  font-size: 18px;
  font-weight: 700;
}

/*****************************************
faq
*****************************************/
.faq .l-sec_inner {
  max-width: 930px;
}

.faq_anchorList {
  display: flex;
  justify-content: center;
  gap: 15px;
}

@media screen and (max-width: 767px) {
  .faq_anchorList {
    gap: 4px;
  }
}

/* item */
.faq_anchorList li {
  flex: 1;
  max-width: 240px;
  color: var(--color-accent-brown) !important;
}

@media screen and (max-width: 767px) {
  .faq_anchorList li {
    width: calc((100% - 8px)/3);
    max-width: none;
  }
}

/* anchor */
.faq_anchor {
  display: flex;
  justify-content: center;
  align-items: center;
  min-height: 50px;
  padding: 0 30px;
  border-radius: 999px;
  font-size: 18px;
  font-weight: 700;
  text-align: center;
  text-decoration: none;
  position: relative;
  background-color: var(--color-white);
  border: 2px solid var(--color-accent-brown);
  transition: var(--transition);
  line-height: 1.2;
}

.faq_anchor::after {
  margin-left: 0;
  content: "\E886";
  font-family: recop-iconfonts;
  color: var(--color-accent-brown);
  position: absolute;
  top: 50%;
  right: 15px;
  transform: translateY(-50%);
}

.faq_anchor span,
a.faq_anchor:hover::after,
a.faq_anchor:hover span {
  color: var(--color-accent-brown);
}

@media (hover: hover) and (pointer: fine) {
  .faq_anchor:hover {
    opacity: var(--opacity);
  }
}

@media screen and (max-width: 767px) {
  .faq_anchor {
    min-height: 46px;
    font-size: 14px;
    padding: 0 10px;
  }

  .faq_anchor::after {
    right: 8px;
  }
}

/*list*/
.faq_content {
  margin-top: 60px;
}

.faq_content+.faq_content {
  margin-top: 80px;
}

.faq_heading {
  margin-bottom: 24px;
  font-size: 26px;
  font-weight: 700;
  text-align: center;
}

@media screen and (max-width: 767px) {
  .faq_content {
    margin-top: 30px;
  }

  .faq_content+.faq_content {
    margin-top: 60px;
  }

  .faq_heading {
    margin-bottom: 16px;
    font-size: 20px;
  }
}

/* item */
.faq_item {
  border-top: 1px solid var(--color-border);
}

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

/* question */
.faq_question {
  margin: 0;
}

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

/* question button */
.faq_question-btn {
  display: flex;
  align-items: center;
  width: 100%;
  padding: 28px 0;
  background: transparent;
  border: none;
  text-align: left;
  cursor: pointer;
  position: relative;
  transition: var(--transition);
}

@media (hover: hover) and (pointer: fine) {
  .faq_question-btn:hover {
    opacity: var(--opacity);
  }
}

@media screen and (max-width: 767px) {
  .faq_question-btn {
    min-height: 64px;
    padding: 16px 0;
  }
}

/* mark */
.faq_mark {
  color: var(--color-accent-red);
  font-family: "Josefin Sans";
  font-size: 40px;
  font-weight: 700;
  text-align: center;
  flex-shrink: 0;
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
}

@media screen and (max-width: 767px) {
  .faq_mark {
    font-size: 36px;
  }
}

/* question text */
.faq_question-text {
  flex: 1;
  padding-left: 45px;
  font-size: 20px;
  font-weight: 700;
}

@media screen and (max-width: 767px) {
  .faq_question-text {
    font-size: 18px;
  }
}

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

/* icon */
.faq_icon {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: var(--color-button-gray);
  flex-shrink: 0;
  position: relative;
}

.faq_icon::before,
.faq_icon::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  background: var(--color-white);
  transform: translate(-50%, -50%);
  transition: var(--transition);
}

.faq_icon::before {
  width: 10px;
  height: 2px;
}

.faq_icon::after {
  width: 2px;
  height: 10px;
}

.faq_question-btn[aria-expanded="true"] .faq_icon::after {
  opacity: 0;
}

@media screen and (max-width: 767px) {
  .faq_icon {
    width: 20px;
    height: 20px;
  }

  .faq_icon::before {
    width: 8px;
  }

  .faq_icon::after {
    height: 8px;
  }
}

/* answer */
.faq_answer {
  padding: 0 0 24px;
  position: relative;
}

@media screen and (max-width: 767px) {
  .faq_answer {
    padding: 0 0 20px;
  }
}

/* answer inner */
.faq_answer-inner {
  display: flex;
  align-items: flex-start;
  padding-left: 45px;
  position: relative;
}

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

.faq_answer .faq_mark {
  color: var(--color-primary);
  top: -10px;
  transform: none;
}


/*****************************************
float
*****************************************/
.float_btnWrap {
  position: fixed;
  display: flex;
  flex-direction: column;
  gap: 10px;
  bottom: 10px;
  right: 10px;
  z-index: 10;
  opacity: 0;
  visibility: hidden;
  transform: translateY(20px);
  transition: opacity .3s, transform .3s, visibility .3s;
}

.float_btnWrap.is-show {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

/*entry*/
.entry_btn {
  margin-top: 78px;
  width: 85px;
  height: 85px;
  padding: 0;
  aspect-ratio: 1;
  border-radius: 50%;
  border-color: transparent;
  background: var(--color-accent-orange);
  flex-direction: column;
  font-size: 18px;
  font-weight: 700;
  gap: 0.2861vw;
  text-decoration: none;
  box-shadow: 2px 2px 6px 0 rgba(0, 0, 0, 0.25);
  transition: var(--transition);
  position: relative;
}

.entry_btn::before {
  content: "";
  width: 78px;
  height: 77px;
  flex-shrink: 0;
  aspect-ratio: 78/77;
  background: url("/jobfind-pc/original/images/icon_tomato_kv-btn.png") no-repeat center/contain;
  position: absolute;
  top: -78px;
  left: 50%;
  transform: translateX(-58%);
  display: block;
  transition: var(--transition);
}

.entry_btn:hover::before {
  top: -83px;
}

.entry_btn span {
  display: block;
  text-align: center;
  color: var(--color-white);
  line-height: 1.2;
}

.entry_btn::after {
  content: "\E907";
  font-family: recop-iconfonts;
  font-size: 14px;
  font-weight: normal;
  position: static;
  color: var(--color-white);
  line-height: 1;
}

@media (hover: hover) and (pointer: fine) {
  a.entry_btn:hover {
    color: var(--color-white);
    background-color: var(--color-accent-red);
    opacity: 1;
  }

  a.entry_btn:hover span,
  a.entry_btn:hover::after {
    color: var(--color-white);
    opacity: 1;
  }
}

/*pagetop*/
.pagetop_btn {
  display: flex;
  justify-content: center;
}

.pagetop_btn a {
  width: 55px;
  height: 55px;
  border-radius: 50%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-decoration: none;
  font-weight: bold;
  color: var(--color-accent-red) !important;
  transition: var(--transition);
  background-color: var(--color-bg-red);
  box-shadow: 2px 2px 6px 0 rgba(0, 0, 0, 0.25);
  position: relative;
}

.pagetop_btn a::before {
  content: "\E884";
  font-family: recop-iconfonts;
  line-height: 1;
}

@media (hover: hover) and (pointer: fine) {
  .pagetop_btn a:hover {
    color: var(--color-white) !important;
    background-color: var(--color-accent-red);
  }
}


#footer {
  position: static;
}

#main .space {
  padding-bottom: 0;
}

@media screen and (max-width: 767px) {
  #areaLink div.area {
    margin-bottom: 60px;
  }
}