@import url('ress.min.css');
@import url('https://fonts.googleapis.com/css2?family=Josefin+Sans:ital,wght@0,100..700;1,100..700&family=Noto+Sans+JP:wght@100..900&display=swap');

@font-face {
  font-family: 'Local Noto Sans JP';
  src:
    local('Noto Sans JP'),
    /* Windows用 */
    local('Noto Sans CJK JP Regular')
    /* Android用 */
  ;
}

/*base*/
/*------------------------------------------------------------------------------*/
:root {
  --color-primary: #153374;
  --color-secondary: #58A0C8;
  --color-black: #322B2B;
  --color-gray: #C0C0C0;
  --color-white: #FFFFFF;

  /* --- Font Sizes (Figmaのテキストスタイルに準拠) --- */
  /* 基本サイズを16px(1rem)とし、ブラウザ設定に合わせやすくします */
  --font-size-xs: 0.75rem;
  /* 12px */
  --font-size-sm: 0.875rem;
  /* 14px */
  --font-size-base: 1rem;
  /* 16px */
  --font-size-lg: 1.125rem;
  /* 18px */
  --font-size-xl: 1.25rem;
  /* 20px */
  --font-size-2xl: 1.5rem;
  /* 24px */
  --font-size-3xl: 2rem;
  /* 32px */
  --font-size-4xl: 2.5rem;
  /* 40px */

  /* --- Spacing (Figmaのオートレイアウト・8の倍数ルール) --- */
  --space-1: 0.25rem;
  /* 4px */
  --space-2: 0.5rem;
  /* 8px */
  --space-3: 0.75rem;
  /* 12px */
  --space-4: 1rem;
  /* 16px */
  --space-6: 1.5rem;
  /* 24px */
  --space-8: 2rem;
  /* 32px */
  --space-10: 2.5rem;
  /* 40px */
  --space-12: 3rem;
  /* 48px */
  --space-16: 4rem;
  /* 64px */

  /* --- Border Radius --- */
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-full: 9999px;

  /* --- Base Settings --- */
  --font-family-base: YakuHanJP_Narrow, "Noto Sans JP", "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;
  --line-height-base: clamp(30px, 23.333px + 1.667vw, 40px);

}

html {
  height: auto;
}

html.lenis {
  height: auto;
}

.lenis.lenis-smooth {
  scroll-behavior: auto !important;
}

.lenis.lenis-smooth [data-lenis-prevent] {
  overscroll-behavior: contain;
}

body {
  font-family: var(--font-family-base);
  font-weight: 700;
  font-size: clamp(15px, 14.333px + 0.167vw, 16px);
  line-height: var(--line-height-base);
  letter-spacing: 20%;
  color: var(--color-black);
  opacity: 0;
  transition: opacity 0.4s ease;
}

body.is-ready {
  opacity: 1;
}

#wrapper {
  overflow: hidden;
}

a {
  text-decoration: none;
  color: var(--color-black);
  transition: 0.6s;
}

a:hover {
  opacity: 0.7;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

ul {
  padding-left: 0;
  margin: 0;
}

.font01 {
  font-family: "Josefin Sans", sans-serif;
  font-weight: 400;
}

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

.img100 img {
  width: 100%;
  height: auto;
  max-width: initial;
  display: flex;
}

.flex01 {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}

.in_bl {
  display: inline-block;
}

.pc {
  display: block;
}

.tb_sp {
  display: none;
}

.pc_tb {
  display: block;
}

.pc_tb.inline {
  display: inline;
}

.sp {
  display: none;
}

.m70_sph {
  margin-bottom: clamp(45px, 28.333px + 4.167vw, 70px);
}

.m85_sph {
  margin-bottom: clamp(80px, 76.667px + 0.833vw, 85px);
}

.m125_sph {
  margin-bottom: clamp(90px, 66.667px + 5.833vw, 125px);
}

.m30 {
  margin-bottom: 30px;
}

.inner01 {
  max-width: 1000px;
  width: 100%;
  margin-left: auto;
  margin-right: auto;
}

/*アニメーション*/
/*------------------------------------------------------------------------------*/
.sensing {
  opacity: 0;
  transform: translateY(30px);
  transition: opacity 0.8s ease, transform 0.8s ease;
  font-weight: 400;
}

.sensing.move {
  opacity: 1;
  transform: translateY(0);
}




/*マウスストーカー*/
/*------------------------------------------------------------------------------*/
#mouse-stalker {
  pointer-events: none;
  position: fixed;
  top: -10px;
  left: -10px;
  width: 20px;
  height: 20px;
  background: rgba(21, 51, 116, 0.5);
  border-radius: 50%;
  transform: translate(0, 0);
  transition: transform 0.2s;
  transition-timing-function: ease-out;
  z-index: 999;
}

/*title*/
/*------------------------------------------------------------------------------*/
.title01 {
  margin-bottom: 30px;
  font-weight: 700;
}

.title01 .font01 {
  font-size: clamp(35px, 28.333px + 1.667vw, 45px);
  display: block;
  line-height: 1;
  color: var(--color-primary);
  letter-spacing: 0;
}

.title01 .font01.wh {
  color: #fff;
}

.title01 .sub {
  font-size: clamp(12px, 10.667px + 0.333vw, 14px);
  color: #1B3C7F;
  line-height: 1.6;
  font-weight: 700;
}

.title01 .sub.wh {
  color: #fff;
}

/*btn*/
/*------------------------------------------------------------------------------*/
.btn01 a,
.btn02 a,
.btn03 a {
  width: 175px;
  height: 50px;
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: var(--color-primary);
  color: var(--color-white);
  border: 3px solid var(--color-primary);
  border-radius: 50px;
  font-size: var(--font-size-sm);
  font-family: "Josefin Sans", sans-serif;
  font-weight: 400;
  letter-spacing: 0;
  line-height: 1.6;
}

.btn03 a {
  background-color: transparent;
  border: 2px solid var(--color-white);
}

.btn01 a .text,
.btn02 a .text,
.btn03 a .text {
  position: relative;
  padding-top: 4px;
}

.btn01 a .text::after {
  content: '';
  background: url(../image/icon_contact_w.png) no-repeat;
  width: 15px;
  height: 13px;
  position: absolute;
  right: -25px;
  top: 6px;
}

.btn02 a .text::after,
.btn03 a .text::after {
  content: '';
  background: url(../image/icon_arrow.png) no-repeat;
  width: 13px;
  height: 11px;
  position: absolute;
  right: -27px;
  top: 8px;
}

.btn01 a:hover,
.btn02 a:hover,
.btn03 a:hover {
  background-color: var(--color-white);
  color: var(--color-primary);
  opacity: 1;
}

.btn01 a:hover .text::after {
  background: url(../image/icon_contact.png) no-repeat;
}

.btn02 a:hover .text::after,
.btn03 a:hover .text::after {
  background: url(../image/icon_arrow_b.png) no-repeat;
}

/* --- pagetop --- */
.c-pagetop {
  position: fixed;
  right: 20px;
  bottom: 20px;
  z-index: 998;
  cursor: pointer;
  width: 114px;
  height: auto;

  opacity: 0;
  visibility: hidden;
  transform: translateY(20px);
  transition: all 0.3s ease;
}

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

/* --- ページ遷移アニメーション --- */
.p-transition {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: var(--color-primary);
  z-index: 9999;
  pointer-events: none;

  transform: translateX(0);
  transition: transform 0.8s cubic-bezier(0.65, 0.05, 0.36, 1);
}

.p-transition.is-leave {
  transform: translateX(0);
}

.p-transition.is-enter {
  transform: translateX(100%);
}

/*header*/
/*------------------------------------------------------------------------------*/
header {
  letter-spacing: 0;
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  background-color: var(--color-white);
  z-index: 1000;
  box-shadow: none;
  opacity: 0;
  visibility: hidden;
  transform: translateY(-20px);
  transition: transform 0.4s ease, opacity 0.4s ease, visibility 0.4s background-color 0.3s, box-shadow 0.3s;
}

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

header.is-visible.is-hide {
  transform: translateY(-100%);
}

header.is-visible.is-show {
  transform: translateY(0);
  box-shadow: 0 4px 20px rgba(21, 51, 116, 0.1);
}

#header_in {
  display: flex;
  align-items: center;
  width: 100%;
  height: 95px;
  padding-right: 180px;
  margin-left: auto;
  margin-right: auto;
  position: relative;
}

#logo {
  margin-left: 28px;
  line-height: 1;
}

#nav_pc {
  margin-left: auto;
  display: flex;
  justify-content: space-between;
  list-style: none;
  gap: 4em;
  font-size: var(--font-size-sm);
}

#nav_pc a {
  display: block;
  position: relative;
  text-align: center;
  overflow: hidden;
}

#nav_pc a:hover {
  opacity: 1;
}

#nav_pc a span {
  display: block;
  width: 100%;
  margin: 0 auto;
  transition: all 0.2s;
}

#nav_pc a span.ja {
  position: absolute;
  top: 100%;
  left: 0%;
  white-space: nowrap;
}

#nav_pc a:hover span.en {
  transform: translate(0%, -150%);
}

#nav_pc a:hover span.ja {
  top: -2px;
}

.h_btn {
  margin-left: 2em;
}

/* --- ハンバーガーボタン --- */
.c-hamburger {
  position: absolute;
  top: -50px;
  right: -35px;
  z-index: 1001;
  width: 180px;
  height: 180px;
  background-color: var(--color-secondary);
  border-radius: var(--radius-full);
  border-color: var(--color-secondary);
  cursor: pointer;
  outline: none;
  display: flex;
  justify-content: center;
  align-items: center;
  transition: all 0.3s;
}

.is-hide .c-hamburger {
  transform: translateY(-100%);
}

.is-show .c-hamburger {
  transform: translateY(0);
  box-shadow: 0 4px 20px rgba(21, 51, 116, 0.1);
}

.c-hamburger__container {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 10px;
}

.c-hamburger__icon {
  width: 64px;
  height: 48px;
  position: relative;
  margin-bottom: 34px;
}

.c-hamburger span {
  position: absolute;
  left: 0;
  height: 6px;
  background-color: var(--color-white);
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.c-hamburger span:nth-child(1) {
  top: 35px;
  width: 80%;
}

.c-hamburger span:nth-child(2) {
  top: 49px;
  width: 100%;
}

.c-hamburger span:nth-child(3) {
  top: 63px;
  width: 80%;
}

.c-hamburger span:nth-child(4) {
  top: 77px;
  width: 60%;
}

.c-hamburger__text {
  font-size: var(--font-size-sm);
  color: var(--color-white);
  line-height: 1;
}

/* --- 開いた時のボタンの状態（×印） --- */
.is-active.c-hamburger span {
  width: 70%;
  height: 4px;
  top: 49px;
}

.is-active.c-hamburger span:nth-child(1),
.is-active.c-hamburger span:nth-child(2) {
  transform: rotate(45deg);
}

.is-active.c-hamburger span:nth-child(3),
.is-active.c-hamburger span:nth-child(4) {
  transform: rotate(-45deg);
}

/* --- メニューを「拡大しながら」表示 --- */
#nav_sp {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  background-color: var(--color-primary);
  color: var(--color-white);
  line-height: 1;
  z-index: 1000;
  display: block;
  overflow-y: auto;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
  opacity: 0;
  visibility: hidden;
  transform: scale(0.5);
  transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

.is-active#nav_sp {
  opacity: 1;
  visibility: visible;
  transform: scale(1);
  padding: 150px 20px 190px;
}

#nav_sp a {
  color: #f4f4f4;
  font-size: 14px;
}

#nav_sp p+a {
  color: #C0C0C0;
}

#nav_sp_in {
  width: 100%;
  max-width: 925px;
  margin-left: auto;
  margin-right: auto;
  opacity: 0;
  transform: translateY(20px);
  transition: all 0.5s ease;
  min-height: calc(100% + 1px);
}

.is-active #nav_sp_in {
  opacity: 1;
  transform: translateY(0);
  transition-delay: 0.3s;
}

#nav_sp #logo_sp {
  padding-bottom: 28px;
  border-bottom: 1px solid var(--color-white);
  margin-bottom: 49px;
}

#nav_sp .menu {
  display: flex;
  justify-content: space-between;
}

.nav_box_wrap {
  margin-bottom: 30px;
}

.nav_box {
  margin-bottom: 40px;
}

.nav_box p {
  font-size: 28px;
  margin: 0 0 14px;
}

#nav_sp ul {
  list-style: none;
  margin-top: 19px;
  line-height: 1.6;
}

#nav_sp li {
  margin-bottom: 3px;
}

#nav_sp li a::before {
  content: 'ー';
  width: 1em;
  margin-right: 0.5em;
}

#nav_sp .btn01 a {
  color: var(--color-white);
  border: 3px solid var(--color-white);
  line-height: var(--line-height-base);
  line-height: 1.6;
}

#nav_sp .btn01 a:hover {
  background-color: var(--color-white);
  color: var(--color-primary);
  opacity: 1;
}

#nav_sp .btn01 a:hover .text::after {
  background: url(../image/icon_contact.png) no-repeat;
}

/*bottom_recruit*/
/*------------------------------------------------------------------------------*/
.bottom_recruit {
  max-width: 956px;
  margin: 0 auto -100px;
  border: 10px solid #163375;
  padding: 25px 20px 20px clamp(20px, -6.667px + 6.667vw, 60px);
  border-radius: 30px;
  z-index: 2;
  position: relative;
  background: #fff;
  box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25);
  align-items: center;
}

.bottom_recruit .left_box {
  width: 50%;
}

.bottom_recruit .title01 {
  margin-bottom: 16px;
}

.bottom_recruit .title01 .sub {
  color: #404040;
}

.bottom_recruit .txt01 {
  font-size: clamp(20px, 12.000px + 2vw, 32px);
  line-height: 1.875;
  margin-bottom: 15px;
  font-weight: 700;
}

.bottom_recruit .btn02 {
  margin-top: 25px;
}

.bottom_recruit .right_box {
  width: 50%;
}

/*footer*/
/*------------------------------------------------------------------------------*/
footer {
  background: var(--color-primary);
  color: var(--color-white);
  padding-top: 160px;
  letter-spacing: 0;
}

footer a {
  color: #f4f4f4;
}

#footer_in {
  max-width: 1060px;
  width: 100%;
  margin: 0 auto;
}

.foot_top {
  display: flex;
  flex-wrap: wrap;
  margin-bottom: 50px;
  max-width: 1060px;
}

.foot_top .f_left {
  width: 350px;
  padding: 0 20px 0 0;
}

.foot_top .f_left p {
  font-size: 11px;
  line-height: 2;
  display: flex;
  color: #f4f4f4;
}

.foot_top .f_left p .title {
  display: flex;
  align-items: center;
  width: 7em;
}

.foot_top .f_left p .title::after {
  content: '｜';
  display: block;
  width: 1em;
  margin-left: auto;
}

.foot_top .f_logo {
  margin-bottom: 25px;
}

.foot_top .f_right {
  flex: 1;
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}

.f_menu_box {
  margin-right: 10px;
}

.f_menu_box p {
  font-size: 18px;
  line-height: 1;
  margin-bottom: 5px;
}

.f_menu_box .sub {
  margin-bottom: 25px;
  font-size: 13px;
  display: block;
  line-height: 1.6;
  color: #C0C0C0;
}

.f_menu_box ul {
  list-style: none;
}

.f_menu_box li {
  margin-bottom: 10px;
  font-size: 12px;
  line-height: 1.2;
  padding-left: 1.3em;
}

.f_menu_box li a {
  position: relative;
}

.f_menu_box li a::before {
  content: 'ー';
  position: absolute;
  width: 1em;
  left: -1.3em;
  top: 50%;
  transform: translate(0, -50%);
}

.foot_bottom {
  border-top: 1px solid var(--color-white);
  padding: 40px 3.8% 60px 0;
  display: flex;
  align-items: flex-end;
  flex-direction: row-reverse;
  line-height: 1.6;
}

.foot_bottom .f_left {
  font-size: 11px;
}

.foot_bottom .f_left a {
  display: flex;
  align-items: center;
}

.foot_bottom .f_left a:after {
  content: '';
  width: 1em;
  height: 1em;
  background: url(../image/icon_link_small.png) no-repeat;
  margin-left: 1em;
}

.foot_bottom .f_left .copy {
  margin: 20px 0 25px;
}

.foot_bottom .f_right {
  max-width: 640px;
  margin-left: auto;
  display: flex;
  gap: 7px 1%;
  flex-wrap: wrap;
  font-size: 11px;
}

.foot_bottom .f_right a {
  display: block;
  padding: 24px 30px 24px 40px;
  border-radius: 20px;
}

.foot_bottom .f_right .sub {
  display: block;
  font-size: 18px;
}

.foot_bottom .btn_contact {
  width: 100%;
}

.foot_bottom .btn_contact a {
  background: var(--color-white);
  color: var(--color-primary);
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  border: 2px solid var(--color-white);
}

.foot_bottom .btn_contact a:hover {
  background: var(--color-primary);
  color: var(--color-white);
  opacity: 1;
}

.foot_bottom .btn_contact .sub {
  display: block;
  font-size: 20px;
  display: flex;
  align-items: center;
}

.foot_bottom .btn_contact .sub:after {
  content: '';
  width: 1em;
  height: 1em;
  background: url(../image/icon_contact.png) no-repeat;
  margin-left: 0.8em;
}

.foot_bottom .btn_contact a:hover .sub:after {
  background: url(../image/icon_contact_w.png) no-repeat;
}

.foot_bottom .btn_contact .txt {
  margin-left: auto;
  font-size: 10px;
  line-height: 2;
}

.foot_bottom .hover_card {
  width: 49.5%;
}

.foot_bottom .btn_rct01 a {
  background: var(--color-secondary) url(../image/icon_link_w.png) no-repeat right 30px center;
  ;
}

.foot_bottom .btn_rct02 a {
  color: #37302C;
  background: #fdf5aa url(../image/icon_link_b.png) no-repeat right 30px center;
  ;
}

.hover_card a {
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.hover_card a:hover {
  transform: translateY(-8px);
  box-shadow: 0 8px 20px rgba(0, 0, 0, .5);
  opacity: 1;
}

/* screens smaller than 1200---------------------------------------------------------- */
@media only screen and (max-width:1199px) {

  /*header*/
  /*------------------------------------------------------------------------------*/
  #nav_pc {
    gap: clamp(16px, -224.000px + 24vw, 64px);
  }

  .h_btn {
    margin-left: clamp(16px, -64.000px + 8vw, 32px);
    ;
  }


  /*------------------------------------------------------------------------------*/
}

/*------------------------------------------------------------------------------*/

/* screens smaller than 1060---------------------------------------------------------- */
@media only screen and (max-width:1059px) {

  /*footer*/
  /*------------------------------------------------------------------------------*/
  #footer_in {
    width: 92%;
  }

  .foot_top {
    margin-bottom: 35px;
  }

  .foot_top .f_left {
    width: 100%;
    margin-bottom: 22px;
    padding: 0;
  }

  .foot_top .f_right {
    border-top: 1px solid var(--color-white);
    padding-top: 40px;
    width: 100%;
  }

  .foot_bottom {
    border-top: none;
    padding: 0 0 60px;
    display: block;
  }

  .foot_bottom .f_left {
    padding-top: 115px;
  }

  .foot_bottom .f_left .copy {
    margin-bottom: 0;
  }

  .foot_bottom .f_right {
    max-width: initial;
    max-width: auto;
  }

  .foot_bottom .btn_contact .txt {
    margin-left: 60px;
  }

  /*------------------------------------------------------------------------------*/
}

/*------------------------------------------------------------------------------*/

/* screens smaller than 1000---------------------------------------------------------- */
@media only screen and (max-width:999px) {

  .inner01 {
    width: 92%;
  }

  .pc {
    display: none;
  }

  .tb_sp {
    display: block;
  }

  /*header*/
  /*------------------------------------------------------------------------------*/
  #nav_pc,
  .h_btn {
    display: none;
  }

  #header_in {
    width: 95%;
    margin-left: auto;
    margin-right: auto;
    height: clamp(81px, 71.667px + 2.333vw, 95px);
    padding-right: clamp(140px, 113.333px + 6.667vw, 180px);
  }

  #logo {
    margin-left: 0;
    width: clamp(160px, 100.667px + 14.833vw, 249px);
  }

  .c-hamburger {
    width: clamp(140px, 113.333px + 6.667vw, 180px);
    height: clamp(140px, 113.333px + 6.667vw, 180px);
    right: -55px;
  }

  .c-hamburger__container {
    gap: clamp(6px, 3.333px + 0.667vw, 10px);
    margin-right: clamp(20px, 29.412px + -2.941vw, 0px);
  }

  .c-hamburger__icon {
    width: clamp(48px, 37.333px + 2.667vw, 64px);
    height: clamp(36px, 28.000px + 2vw, 48px);
    margin-bottom: clamp(40px, 44.000px + -1vw, 34px);
  }

  .c-hamburger span {
    height: 5px;
  }

  .c-hamburger span:nth-child(1) {
    top: 41px;
  }

  .c-hamburger span:nth-child(2) {
    top: 52px;
  }

  .c-hamburger span:nth-child(3) {
    top: 63px;
  }

  .c-hamburger span:nth-child(4) {
    top: 74px;
  }

  .is-active.c-hamburger span {
    top: clamp(59px, 65.667px + -1.667vw, 49px);
    ;
  }

  .is-active#nav_sp {
    padding: 15vw clamp(30px, -26.471px + 17.647vw, 150px);
  }

  #nav_sp a {
    font-size: clamp(11px, 9.000px + 0.5vw, 14px);
  }

  #nav_sp_in {
    width: 95%;
    max-width: auto;
    max-width: initial;
  }

  #nav_sp #logo_sp img {
    width: clamp(160px, 100.667px + 14.833vw, 249px);
  }

  #nav_sp .menu {
    justify-content: space-around;
    flex-wrap: wrap;
    gap: 2%;
  }

  .nav_box_wrap {
    margin-bottom: 0;
    width: 49%;
  }

  .nav_box {
    margin-bottom: clamp(25px, 15.000px + 2.5vw, 40px);
  }

  .nav_box p {
    font-size: clamp(18px, 11.333px + 1.667vw, 28px);
    margin: 0 0 0.5em;
  }

  #nav_sp .btn01 a {
    margin-left: auto;
    margin-right: auto;
    font-size: 14px;
  }

  /*footer*/
  /*------------------------------------------------------------------------------*/
  .foot_top.inner01 {
    width: 100%;
  }

  /*------------------------------------------------------------------------------*/
}

/*------------------------------------------------------------------------------*/

/* screens smaller than 769---------------------------------------------------------- */
@media only screen and (max-width:768px) {

  .inner01 {
    width: 88%;
  }

  .l_h250 {
    line-height: 2;
  }

  .sp {
    display: block;
  }

  .pc_tb {
    display: none;
  }

  .pc_tb.inline {
    display: none;
  }

  /* --- pagetop --- */
  .c-pagetop {
    width: 70px;
  }

  /*bottom_recruit*/
  /*------------------------------------------------------------------------------*/
  .bottom_recruit {
    padding: 60px clamp(20px, -23.478px + 10.87vw, 60px) 30px;
    max-width: 640px;
  }

  .bottom_recruit .left_box {
    width: 100%;
    margin-bottom: 20px;
  }

  .bottom_recruit .txt01 {
    line-height: 1.5;
    margin-bottom: 15px;
  }

  .bottom_recruit .right_box {
    width: 100%;
    margin-bottom: 25px;
    text-align: center;
  }

  .bottom_recruit .right_box img {
    max-width: 360px;
    width: 100%;
  }

  .bottom_recruit .btn02.sp {
    margin: 0 auto;
  }

  /*footer*/
  /*------------------------------------------------------------------------------*/
  #footer_in {
    width: 88%;
  }

  .foot_top {
    margin-bottom: 0;
  }

  .f_menu_wrap {
    width: 50%;
    margin-bottom: 40px;
  }

  .f_menu_wrap:nth-child(2n) .f_menu_box {
    margin-right: 0;
  }

  .foot_bottom .f_right {
    max-width: initial;
    max-width: auto;
    gap: 10px 0;
  }

  .foot_bottom .f_right a {
    padding: 24px 10px 18px 20px;
  }

  .foot_bottom .btn_contact .title {
    width: 100%;
    margin-bottom: 12px;
  }

  .foot_bottom .btn_contact .sub {
    line-height: 1;
  }

  .foot_bottom .btn_contact .txt {
    margin-left: 0;
    width: 100%;
  }

  .foot_bottom .hover_card {
    width: 100%;
  }

  /*------------------------------------------------------------------------------*/
}

/*------------------------------------------------------------------------------
/*------------------------------------------------------------------------------*/
/* screens smaller than 641---------------------------------------------------------- */
@media only screen and (max-width:640px) {

  /*bottom_recruit*/
  /*------------------------------------------------------------------------------*/
  .bottom_recruit {
    margin: 0 auto -30px;
  }

  /*footer*/
  /*------------------------------------------------------------------------------*/
  footer {
    padding-top: 80px;
  }

  .foot_bottom .f_left {
    padding-bottom: 70px;
  }

  /*------------------------------------------------------------------------------*/
}

/*------------------------------------------------------------------------------*/

.btn02 .current {
  width: 175px;
  height: 50px;
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: var(--color-white);
  color: var(--color-primary);
  opacity: 1;
  border: 3px solid var(--color-primary);
  border-radius: 50px;
  font-size: var(--font-size-sm);
  font-family: "Josefin Sans", sans-serif;
  font-weight: 400;
  letter-spacing: 0;
  line-height: 1.6;
  position: relative;
  padding-top: 4px;
  position: relative;
}

.btn02 .current::after {
  content: '';
  background: url(../image/icon_arrow_b.png) no-repeat;
  width: 13px;
  height: 11px;
  position: absolute;
  right: 18px;
  top: 16px;
}