@charset "UTF-8";

body{
   font-family: 'Noto Sans JP', sans-serif;
   background-size: 25px 25px;
   background-image: repeating-linear-gradient(90deg, #ffee5a, #ffee5a 1px, transparent 1px, transparent 30px), repeating-linear-gradient(0deg, #ffee5a, #ffee5a 1px, #fff 1px, #fff 30px);
}
.en{
   font-family: "Outfit", sans-serif;
}
/* コンテンツ共通CSS */
/* CSS Document */
/* ロゴ */
#logo {
   position: relative;
   max-width: 293px;
   width: 100%;
   top: 48px;
   left: 30px;
   transition: all 0.3s;
   transform: translateY(-50%);
   z-index: 300;
}

/* .open #logo {
   display: none;
} */

.logo_blue {
   display: none;
}

.logo_wh {
   display: flex;
}

.nav-active .logo_blue {
   display: flex;
}

.nav-active .logo_wh {
   display: none;
}

/* インナー */
.inner,
.container {
   margin: 0 auto;
}

.hide_menu {
   opacity: 0.3 !important
}

@media screen and (max-width: 780px) {
   body{
      background-size: 20px 20px;
   }
   #nav-sp li p .hide_menu {
      margin: 0 0 10px 16px;
      display: inline-block;
   }
}

/* ボタン */

select {
   background-image: url("../img/icon-arrow-07.png");
   background-position: right 10px center;
   background-repeat: no-repeat;
   background-size: 10px auto;
}

.btn {}

.btn a {
   border-radius: 50px;
   background-color: #f8f8f8;
   display: inline-block;
   padding: 20px 35px;
   line-height: 1;
   box-shadow: 2px 2px 2px #e0e0e0, -2px -2px 22px #ffffff;
   transition: .35s ease-in-out;
   cursor: pointer;
}

.btn a:hover {
   background-color: #333;
   color: #f8f8f8;
   opacity: 1;
}

.btn a:before {
   content: '\e5cc';
   font-family: 'Material Icons';
   display: inline-flex;
   vertical-align: middle;
   margin: 0 25px 0 0;
   transition: .35s ease-in-out;
}

.blk-sin_ttl .btn a:before {
   content: '\e5cb' !important;
   font-family: 'Material Icons';
   display: inline-flex;
   vertical-align: middle;
   margin: 0 25px 0 0;
   transition: .35s ease-in-out;
}


.btn a:hover:before {
   content: '\e5cc';
   font-family: 'Material Icons';
   display: inline-flex;
   vertical-align: middle;
   margin: 0 22px 0 3px;
}

.blk-sin_ttl .btn a:hover:before {
   content: '\e5cb' !important;
   font-family: 'Material Icons';
   display: inline-flex;
   vertical-align: middle;
   margin: 0 22px 0 3px;
}


/* コンテンツはみ出した場合に使用 */
.overflow {
   width: 100%;
   overflow: hidden;
}

.overflow-x {
   width: 100%;
   overflow-x: hidden;
   overflow-y: visible;
}

h1 {}

h2 {}

h3 {}

h4 {}

h5 {}

h6 {}

/*- --- ページトップへ戻るボタン設定 --- -*/
main{
   position: relative;
}
.page_top {
   position: absolute;
   bottom: 11rem;
   right: 5vw;
   z-index: 400;
   background-image: url("../img/recruit/icon-top.png");
   background-repeat: no-repeat;
   background-position: center center;
   /* background-size: 25px;
   background-color: #333; */
}

@media screen and (max-width: 780px) {
   .page_top {
      background-size: 8vw;
      right: 0;
      bottom: auto;
      top: 0;
   }
}

.page_top a {
   position: relative;
   display: block;
   width: 50px;
   height: 50px;
   text-decoration: none;
}

.page_top a::before {
   content: '';
}

@media screen and (max-width: 780px) {
   .page_top a {
      position: relative;
      display: block;
      width: 40px;
      height: 40px;
      text-decoration: none;
   }
}

/* メインメニュー全体 */
#nav-pc {
   width: 100%;
   min-height: 90px;
   z-index: 900;
   transition: all 0.2s;
   position: fixed/*relative*/;
   top: 0;
}

@media screen and (max-width: 760px) {
   #nav-pc {
      margin-top: 0;
   }
   #mv-page {
    margin-top: 55px;
   }
}

/* メインメニュー */
#nav-contents {
   position: absolute;
   right: 455px;
   top: 50%;
   opacity: 1;
   transition: all 0.5s;
   font-weight: 300;
   transform: translateY(-40%);
   z-index: 500;
}

.open #nav-contents {
   display: none;
}

@media screen and (max-width: 960px) {
   #nav-contents {
      display: none
   }
}

#nav-contents ul {
   display: flex;
   justify-content: flex-end;
   align-items: center;
   list-style: none;
   transition: all 0.1s;
   letter-spacing: 0.2em
}

#nav-contents ul {
   font-size: 1.4rem;
   letter-spacing: 0.1em;
}

@media screen and (max-width: 1200px) {
   #nav-contents ul {
      font-size: 10px;
   }
}

#nav-contents ul li {
   padding: 0 16px;
   line-height: 120%;
   width: auto;
   font-weight: 400;
}

/* #nav-contents ul li:nth-child(n):before {
   display: block;
   font-size: 10px;
   transform: scale(0.8);
   transform-origin: center left;
   font-family: 'Inter', sans-serif;
}

#nav-contents ul li:nth-child(1):before {
   content: "BUSINESS";
}

#nav-contents ul li:nth-child(2):before {
   content: "WORKS";
}

#nav-contents ul li:nth-child(3):before {
   content: "CORP";
}

#nav-contents ul li:nth-child(4):before {
   content: "RECRUIT";
}

#nav-contents ul li:nth-child(5):before {
   content: "CSR";
}

#nav-contents ul li:nth-child(6):before {
   content: "NEWS";
}

#nav-contents ul li:nth-child(7):before {
   content: "CONTACT";
} */

/* サブメニュー＆情報 */
/* Toggle Button */
.nav-btns{
position: fixed;
    display: flex;
    top: 17px;
    right: 27px;
    align-items: center;
    gap: 20px;
   }
#nav-toggle {
   /* display: none;
   position: absolute; */
   display: block;
   /* position: fixed;
   right: 20px;
   top: 55px; */
   padding: 15px 7px;
   width: 55px;
   height: 55px;
   cursor: pointer;
   z-index: 510;
   /* border-radius: 50%;
   background: #f8f8f8;
   box-shadow: 1px 1px 1px #c6c6c6, -1px -1px 1px #ffffff; */
   transition: .35s ease-in-out;
}

#nav-toggle:hover {
   /* background: #333;
   color: #f8f8f8;
   box-shadow: 0, 0; */
   opacity: .8;
}

/* @media screen and (max-width: 780px) {
   #nav-toggle:hover {
      background: #f8f8f8;
      color: #333;
      box-shadow: 0, 0;
   }
} */

/* .open #nav-toggle {
   border-radius: 50%;
   background: #f8f8f8;
} */

/* .open #nav-toggle:hover {
   border-radius: 50%;
   background: #f8f8f8;
} */

@media screen and (max-width: 768px) {
   .nav-btns{
      width: 52vw;
      /* margin-right: 40px; */
      gap: 10px;
      top: 1vw;
      right: 4vw;
   }

   /* #nav-toggle {
      display: none;
      position: absolute;
      right: 20px;
      top: 13px;
      padding: 10px;
      width: 40px;
      height: 40px;
      background-color: #fff;
   } */
    #nav-toggle {
      width: 14vw;
      padding: 4vw 0;
      margin-left: 2vw;
    }
}

#nav-toggle div {
   position: relative;
}

#nav-toggle span {
   display: block;
   position: absolute;
   height: 1px;
   width: 100%;
   background: #333;
   -webkit-transition: .35s ease-in-out;
   -moz-transition: .35s ease-in-out;
   transition: .35s ease-in-out;
}

/* #nav-toggle:hover span {
   background: #f8f8f8;
}

@media screen and (max-width: 780px) {
   #nav-toggle:hover span {
      background: #333;
   }
} */


#nav-toggle span:nth-child(1) {
   top: 0;
}
#nav-toggle span:nth-child(2) {
   top: 12px;
}
#nav-toggle span:nth-child(3) {
   top: 25px;
}

@media screen and (max-width: 768px) {
   #nav-toggle span:nth-child(1) {
      top: 3px;
   }

   #nav-toggle span:nth-child(2) {
      top: 10px;
   }

   #nav-toggle span:nth-child(3) {
      top: 17px;
   }
}

/* @media screen and (max-width: 960px) {
   #nav-toggle {
      position: fixed;
      display: block;
   }
} */

body:not(.open) #nav-pc:has(.scroll) {
   background: #fff;
}

/* #nav-toggle.scroll {
   position: fixed !important;
   display: block !important;
} */

/* #nav-toggle 切り替えアニメーション */
.open #nav-toggle span:nth-child(1) {
   top: 12px;
   -webkit-transform: rotate(315deg);
   -moz-transform: rotate(315deg);
   transform: rotate(315deg);
   background: #222;
}

.open #nav-toggle span:nth-child(2) {
   top: 12px;
   -webkit-transform: rotate(-315deg);
   -moz-transform: rotate(-315deg);
   transform: rotate(-315deg);
   background: #222;
}
.open #nav-toggle span:nth-child(3) {
   display: none;
}

@media screen and (max-width: 400px) {
   .open #nav-toggle span:nth-child(1) {
      top: 7px;
   }

   .open #nav-toggle span:nth-child(2) {
      top: 7px;
   }
}

/* #nav-block-main スライドアニメーション */
#nav-sp {
   opacity: 0;
   visibility: hidden;
   background-color: #fff;
   position: fixed;
   top: 0;
   z-index: 505;
   width: 100%;
   height: 100vh;
   background-image: linear-gradient(-90deg, #e8e8e8, #f8f8f8 1px);
   background-size: 200px;
   background-position: left 80px top 0;
   transition: all 0.3s
}

#nav-sp .logo {
   position: absolute;
   max-width: 293px;
   width: 100%;
   top: 48px;
   left: 30px;
   transition: all 0.3s;
   transform: translateY(-50%);
}

.open #nav-sp {
   opacity: 1;
   visibility: visible;
}

#nav-sp ul {
   width: 100%;
   margin: 40px auto 0 auto;
}

#nav-sp li {
   margin-bottom: 45px;
   line-height: 1.5;
}

@media screen and (max-width: 780px) {
   #nav-sp ul {
      margin-top: 0;
   }
   #nav-sp li {
      margin-bottom: 6vw;
      line-height: 1.5;
      padding-left: 0; 
      border-left: none;
   }

   #nav-sp li p a {
      margin: 0 0 10px 16px;
      display: inline-block;
   }
   body.open #nav-sp{
      padding-bottom: 0;
   }
}

#nav-sp .bg-content {
   padding: 100px 25px 50px 25px;
   height: 100vh;
   /* background-image: url("../img/greeting/bg-01.png");
   background-repeat: no-repeat;
   background-position: top left; */
   background-size: 25px 25px;
   background-image: repeating-linear-gradient(90deg, #ffee5a, #ffee5a 1px, transparent 1px, transparent 30px), repeating-linear-gradient(0deg, #ffee5a, #ffee5a 1px, #fff 1px, #fff 30px);
}

@media screen and (max-width: 780px) {
   #nav-sp .bg-content {
      /* background-image: url("../img/greeting/bg-01sp.png");
      background-repeat: no-repeat; */
      /* background-position: top left; */
      /* background-size: 90%; */
      height: auto;
      padding: 23vw 4vw 15vw;
   }
}


/* 各ページ＆セクション アイキャッチ画像 */

footer {
   padding: 260px 0 30px 0;
   text-align: center;
   /* background-color: #f2f2f2; */
   position: relative;
   /* background-image: linear-gradient(-90deg, #e8e8e8, #f8f8f8 1px);
   background-size: 200px;
   background-position: left 80px top 0; */
   border-top: 1px solid;
}

@media screen and (max-width: 780px) {
   footer {
      padding: 0 0 10px 0;
      padding-top: clamp(80px, 30vw, 200px);
   }
}

footer .logo-footer {
   max-width: 300px;
}

@media screen and (max-width: 780px) {
   footer .logo-footer {
      margin-bottom: 30px;
   }
}

@media screen and (max-width: 400px) {
   footer .logo-footer {
      /* max-width: 120px; */
      /* margin-bottom: 30px; */
      width: 53vw;
      margin-bottom: 0;
   }
   footer .mt20{
      margin-top: 0;
      font-size: 3.6vw;
   }
   footer .mb50{
      margin-bottom: 4vw;
   }
   footer .copy{
      margin-top: 4vw;
   }
   footer .copy p{
      font-size: 2.9vw;
   }
}

.nav-footer ul {
   display: flex;
   justify-content: flex-start;
   list-style: none;
   transition: all 0.1s;
   letter-spacing: 0.2em;
   text-align: left;
}


footer .nav-footer ul {
   font-size: 1.4rem;
}

@media screen and (max-width: 780px) {
   footer .nav-footer ul {
      flex-wrap: wrap;
   }
}


footer .nav-footer ul li {
   padding: 0 15px;
   line-height: 120%;
   width: auto;
}

@media screen and (max-width: 780px) {
   footer .nav-footer ul li {
      padding: 10px 0;
      line-height: 120%;
      width: 100%;
   }

}

footer .address dl {
   display: inline-flex;
   max-width: 650px;
   flex-wrap: wrap;
   text-align: left;
}

footer .address dt {
   width: 90px;
}

footer .address dd {
   width: calc(100% - 90px);
}

@media screen and (max-width: 780px) {
   footer .address dl {
      display: inline-flex;
      max-width: 100%;
      flex-wrap: wrap;
      text-align: left;
   }

   footer .address dt {
      width: 100%;
   }

   footer .address dd {
      width: 100%;
      margin-bottom: 40px;
   }

}

footer .sns {
   display: inline-flex;
}

@media screen and (max-width: 780px) {
   footer .sns {
      display: none;
   }
}

footer .sns-sp {
   display: none;
}

@media screen and (max-width: 780px) {
   footer .sns-sp {
      display: inline-flex;
   }
}

footer .btn-sns {
   margin-left: 20px;
}

footer .btn-sns a {
   width: 60px;
   height: 60px;
   border-radius: 50%;
   background-color: #f8f8f8;
   display: block;
   box-shadow: 5px 5px 10px #e0e0e0, -5px -5px 10px #ffffff;
   transition: .35s ease-in-out;
   cursor: pointer;
}

footer .btn-sns a:hover {
   background-color: #333;
}

footer .btn-sns a.face {
   background-image: url("../img/icon-facebook.png");
   background-repeat: no-repeat;
   background-position: center center;
   background-size: 24px;
}

footer .btn-sns a.insta {
   background-image: url("../img/icon-insta.png");
   background-repeat: no-repeat;
   background-position: center center;
   background-size: 24px;
}

footer .btn-sns a.face:hover {
   background-image: url("../img/icon-facebooksp.png");

}

footer .btn-sns a.insta:hover {
   background-image: url("../img/icon-instasp.png");
}


.blk-banner_width {
   max-width: 1280px;
   margin: 0 auto;
   width: 100%;
}

.blk-banner {
   position: absolute;
   top: -110px;
   max-width: 1280px;
   width: 100%;
   /* border: 10px solid #fff; */
   overflow: hidden;
   height: 317px;
}

@media screen and (max-width: 780px) {
   .blk-banner {
      /* border: 5px solid #fff; */
      overflow: hidden;
      height: 70vw /*clamp(170px, 45vw, 350px)*/;
      top: -37vw;
      width: 90%;
      margin: 0 5%;
   }
   footer .f-w30, footer .f-w35{
      width: 100%;
      position: relative;
   }
   footer .w1200 {
    width: 85%;
   }
   footer .w1200:has(.copy) {
    width: 90%;
   }
   footer .f-w30 + .f-w30 {
      margin-bottom: 3vw;
   }
   p.instagram.sp-block {
    text-align: left;
    margin-top: 10vw;
   }
}

.banner {
   background-image: url("../img/recruit/banner_entry.png");
   background-repeat: no-repeat;
   background-size: cover;
   /* transition: all 0.6s; */
   display: flex;
   justify-content: center;
   align-items: center;
   height: 317px;
}

@media screen and (max-width: 780px) {
   .banner {
      background-image: url("../img/recruit/banner_entry_sp.png");
      background-size: 100%;
      height: 66vw/*clamp(170px, 45vw, 350px)*/;
   }
}


.banner img {
   max-width: 199px;
}

@media screen and (max-width: 780px) {
   .banner img {
      max-width: 150px;
   }
}

.banner:hover {
   /* transform: scale(1.1);
   transform-origin: center center; */
   /* opacity: 0.7; */
   animation: flash 0.5s ease;
}


/* アコーディオン */

.ac-btn01,
.ac-btn03,
.ac-btn04 {
   padding-left: 60px;
   width: 100%;
   background-image: url("../img/icon-arrow-01.png");
   background-size: 20px;
   background-repeat: no-repeat;
   background-position: center left;
   cursor: pointer;
   display: block;
   transform: rotate(0);
   transition: all 0.2s;
}

.ac-btn02 {
   padding-left: 60px;
   width: 100%;
   background-image: url("../img/icon-arrow-05.png");
   background-size: 20px;
   background-repeat: no-repeat;
   background-position: center left;
   cursor: pointer;
   display: block;
   transform: rotate(0);
   transition: all 0.2s;
}


.ac-btn01.ac-active,
.ac-btn03.ac-active,
.ac-btn04.ac-active {
   transform: rotate(0);
   background-image: url("../img/icon-arrow-02.png");
}

.ac-btn02.ac-active {
   transform: rotate(0);
   background-image: url("../img/icon-arrow-06.png");
}



.ac-content01,
.ac-content02,
.ac-content03,
.ac-content04 {
   display: block;
   padding: 0;
}

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

   .ac-content01,
   .ac-content02,
   .ac-content03,
   .ac-content04 {
      padding: 25px 0 10px 60px;
      display: none;
   }
}

/* ページネーション */

.wp-pagenavi {
   /* 全体 */
   margin: 20px 0;
   font-size: 12px;
}

.wp-pagenavi a {
   /* フォント色 */
   color: #4a4a4a;
}

.pages {
   /* 左の表記 */
   margin-right: 20px;
}

.wp-pagenavi .current {
   /* ボタン */
   margin: 0 10px 6px 0;
   display: inline-block;
   border: none;
   width: 30px;
   height: 30px;
   border-radius: 50%;
   line-height: 30px;
   text-align: center;
   font-family: 'Inter', sans-serif;
   box-shadow: 2px 2px 2px #e0e0e0, -2px -2px 2px #ffffff;
}

.wp-pagenavi a.page {
   /* ボタン */
   margin: 0 10px 6px 0;
   display: inline-block;
   border: none;
   width: 30px;
   height: 30px;
   border-radius: 50%;
   line-height: 30px;
   text-align: center;
   font-family: 'Inter', sans-serif;

}

.wp-pagenavi .current {
   /* カレント数字 */
   border: none;
   background: #9ac000;
   color: #fff;
}

.wp-pagenavi a.page:hover {
   /* マウスオーバー */
   background: #9ac000;
   color: #fff;
}

.wp-pagenavi .first,
.wp-pagenavi .extend {
   /* ... */
   margin-right: 10px;
}

.wp-pagenavi .previouspostslink,
.wp-pagenavi .nextpostslink {
   /* 記号の削除 */
   margin: 0 6px 6px 0;
   display: inline-block;
   border: none;
   width: 30px;
   height: 30px;
   border-radius: 50%;
   line-height: 30px;
   text-align: center;
   font-family: 'Inter', sans-serif;
   box-shadow: 2px 2px 2px #e0e0e0, -2px -2px 2px #ffffff;
}



.thumbnail {
   text-align: center;
   overflow: hidden;
}

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

a .thumbnail img {
   width: auto;
   height: auto;
   max-width: 100%;
   max-height: 100%;
   transition: all 0.6s;
}


a:hover .thumbnail img {
   transform: scale(1.1);
   transform-origin: center center;
}

.wp-block-image img {
   margin: 10px 0;
   width: auto;
   height: auto;
   max-width: 100%;
   max-height: 100%;
}


.wp-block-separator {
   border: none;
}

/* add 20230825 */
#insta_btn a {
   border-radius: 50px;
   background-color: #f8f8f8;
   display: inline-flex;
   align-items: center;
   padding: 20px 35px;
   line-height: 1;
   box-shadow: 2px 2px 2px #e0e0e0, -2px -2px 22px #ffffff;
   transition: .35s ease-in-out;
   cursor: pointer;
   font-family: 'Inter', sans-serif;
}
#insta_btn a:hover {
   background-color: #333;
   color: #f8f8f8;
   opacity: 1;
}
#insta_btn a:before {
   content: '';
   display: inline-flex;
   width: 20px;
   height: 20px;
   margin: 0 25px 0 0;
   transition: .35s ease-in-out;
   background: center url('../img/icon-insta-btn.png') no-repeat;
   background-size: contain;
}
#insta_btn a:hover:before {
   filter: invert(100%);
}
@media screen and (max-width: 760px) {
   #insta_btn a:before {
      width: 15px;
      height: 15px;
   }
}

header ul li.instagram {
   display: none;
}

@media screen and (min-width: 781px) {
   #nav-contents {
      display: flex;
      justify-content: flex-end;
      align-items: center;
   }
   .sp-instagram {
      display: none;
   }
}

footer #insta_btn {
   display: none;
}

.nav-footer ul {
   letter-spacing: 0;
}

@media screen and (max-width: 760px) {
   #logo {
      position: absolute;
      /* max-width: 100px;
      width: 100%; */
      width: 27vw;
      top: 15px;
      left: 20px;
      transition: all 0.3s;
      transform: translateY(0);
      z-index: 300;
   }
   #nav-pc {
      min-height: 65px;
   }
   #insta_btn {
      position: absolute;
      top: 20px;
      right: 76px;
      width: 120px;
      z-index: 900;
   }
   #insta_btn a {
      display: flex;
      max-width: 100%;
      height: 40px;
      padding: 0 15px;
      font-size: 10px;
      box-shadow: 1px 1px 1px #c6c6c6, -1px -1px 1px #ffffff;
   }
   #insta_btn a::before {
      margin: 0 10px 0 0;
   }
   #nav-sp .logo {
      top: 15px;
      left: 20px;
      max-width: 62px;
      width: 100%;
      transform: translateY(0);
   }
}

/* add 20230906 */
@media screen and (max-width: 780px) {
   #nav-sp li.instagram {
      margin-right: -6vw;
  }
}

#sb_instagram sbi-user-info-inner span::after {
   content: '日';
   display: inline;
}
#sb_instagram .sbi-divider {
   background: transparent;
   margin-bottom: 20px;
}


#mv-page .bg-mv {
    width: 100%;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center top;
    /* height: clamp(220px, 60vw, 480px); */
    height: 100%;
    aspect-ratio: 96 / 67;
}

.recruit.top .bg-mv {
    background-image: url(../img/recruit/mv_top.png);
}
.page h1{
   transform: none;
   top: auto;
   bottom: 2%;
   right: 2%;
   margin: 0;
   position: fixed;
   z-index: 5;
}

#message-header{
   height: auto;
}
#message-header .message-mv{
   background-image: url(../img/recruit/bg-message.png);
   width: 23vw;
    height: 25vw;
    margin-top: 9vw;
    background-size: contain;
}
#message-header article{
   position: relative;
   margin-top: -2vw;
   padding: 0;
   line-height: 2.3;
}
#message-header article ul{
   max-width: 650px;
   margin: 0 auto;
   text-align: center;
}
@media screen and (max-width: 780px) {
   #mv-page .bg-mv {
      background-image: url(../img/recruit/mv_top_sp.png);
      aspect-ratio: 750 / 1109;
      margin-bottom: 30vw;

   }
   #message-header .message-mv{
      background-image: url(../img/recruit/bg-message_sp.png);
      margin: 2vw 0 0;
      width: 100vw;
      height: 146vw;
      position: absolute;
   }
   /* #message-header .message-mv{
      background-image: url(../img/recruit/bg-message_sp.png);
   } */
   #message-header li {
      line-height: 1.9;
   }
   .page h1{
      margin: 0;
      position: fixed;
      width: 60%;
      bottom: 6vw;
      top: unset;
      right: 2%;
      z-index: 5;
   }
   #message-header{
      z-index: 1;
   }
}
#nav-sp .f-w30{
   width: 33%;   
}
#nav-sp li p{
   padding: 10px 20px;
}
@media screen and (max-width: 780px) {
   #nav-sp .f-w30{
      width: 100%;   
   }
   #nav-sp li p{
      padding: 1vw 0;
   }
}

a[target="_blank"].blank:after {
   content: "";
   display: inline-block;
   width: 25px;
   height: 16px;
   background: url(../img/recruit/blank.png) center / contain no-repeat;
   margin-left: 10px;
}

.btn {
   border: 1px solid;
   padding: 17px 31px;
   border-radius: 40px;
   position: relative;
   display: flex;
    width: fit-content;
    margin: 0 auto;
    align-items: center;
}
.btn::after{
   content: "";
   display: inline-block;
   width: 17px;
   height: 17px;
   background: url(../img/recruit/btn-triangle.png) center / contain no-repeat;
   margin-left: 45px;
}
.btn.green {
    background: #bedead;
}
@media screen and (max-width: 780px) {
   .txt-15{font-size: 3.5vw;}
   .txt-16{font-size: 3.4vw;}
   a[target="_blank"]:after {
      width: 4vw;
   }
   .btn {
      padding: 15px 20px;
   }
   .btn::after{
      margin-left: 20px;
   }
}
#news {
    padding: 174px 0 0;
}
.recruit #blk-main {
    /* padding: 0 60px; */
    width: 100%;
}
.recruit #news #blk-main {
    width: 90%;
    margin: 0 auto;    
}

#blk-main .mb30 {
    display: flex;
    align-items: center;
    gap: 40px;
    margin-bottom: 0;
}
.recruit #blk-main article {
    padding: 1px 30px;
    margin-bottom: 0;
    border: none;
    position: relative;
    display: flex;
    margin-bottom: 30px;
}
#blk-main article:before {
    content: '';
    position: absolute;
    width: 150px;
    height: 2.5em;
    border-radius: 50%;
    border: 1px solid #000;
    width: 100%;
    height: 100%;
    border-radius: 80px;
    left: 0;
    z-index: -2;
}

#blk-main article:after {
    clip-path: inset(0 1.2% 0 1.2%);
    content: "";
    background: #fff;
    width: 100%;
    height: 105%;
    position: absolute;
    left: 0;
    top: 0;
    z-index: -1;
}

.recruit #blk-main .day_cat, #blk-side .day_cat{
   display: block;
    height: auto;
}
.recruit #blk-main .day_cat{
   margin-bottom: 0;
   font-size: 1.8rem;
   letter-spacing: 0.15em;
}
.recruit #blk-main .day_cat .icon_new {
   max-width: unset;
   margin: 0;
   position: absolute;
    left: -85px;
    top: calc(50% - 15px);
}


@media screen and (max-width: 780px) {
   #news {
      padding: 29vw 0 0;
   }
   #news img {
      display: block;
      width: 48vw;
      margin-bottom: 6vw;
   }
   #news .blk-message01 {
      background: #fff;
      padding-bottom: 6vw;
   }
   #news #blk-main .mb30 {
      flex-direction: column;
      align-items: flex-start;
      gap: 10px;
   }
   .recruit #blk-main article {
      padding: 8px 20px;
      margin-bottom: 5vw;
   }
   .recruit #blk-main .day_cat .icon_new{
      width: 13vw;
      left: 33vw;
      top: 1.5vw;      
   }

   #blk-main article:before{
      border-radius: 8px;
      left: 0;
      z-index: -2;
      top: 0;
   }
   #blk-main article:after{
      clip-path: inset(0 2% 0 2%);
      top: -1px;
      z-index: -1;
   }
   .recruit #news #blk-main {
      width: 100%;
   }
}
#job{
   padding: 137px 0 80px 0;
   background: #fff;
}
.bg{
   position: absolute;
   top: 0;
   right: 0;
   background-repeat: no-repeat;
   background-position: right center;
   background-size: cover;
   z-index: 0;
   transition-property: background-position;
   transition-duration: .3s;
   transition-delay: 0;
   width: 100vw;
   height: 95vw;
   margin-top: -3vw;
   background-size: contain;
}
.bg-job{
   background-image: url(../img/recruit/bg-job.png);
}
#job .blk-job .contents-job {
   width: calc(100% - 510px);
   margin-left: auto;
   padding-bottom: 40vw;
}
#job .blk-job .contents-job p{
   width: 55%;
   margin: 3vw 0 4vw auto;
   text-align: right;
}
#job .btn {
   width: 25rem;
   margin: 0 0 0 auto;
}
#job .btn::after {
   margin-left: auto;
}
.btn.blue{
   background: #9de2ff;
}
@media screen and (max-width: 780px) {
   #job .w1200 {
      width: 85%;
   }
   .bg-job{
      background-image: url(../img/recruit/bg-job_sp.png);
      height: 256vw;
   }
   #job{
      padding-top: 52vw;
   }
   #job .blk-job .contents-job {
      width: auto;
   }
   #job .blk-job .contents-job p{
      width: 100%;
      text-align: left;
      margin-bottom: 9vw;
   }
   #job .contents-job div:has(img) {
      width: 93%;
      margin-left: auto;
   }
   #job .contents-job img {
      margin-bottom: 0;
   }
   #job .btn{
      margin: 0 auto 0 0;
      width: 41vw;
      padding: 10px 13px 10px 21px;
   }
   #job .btn:after{
      margin-left: 9vw;
   }
   #job .blk-job .contents-job {
      padding-bottom: 95vw;
   }
}
.interview-ttl {
    position: relative;
}
.interview-ttl p {
    text-align: center;
    position: absolute;
    top: 70%;
    left: 0;
    width: 100%;
}
.interview-ttl img{ width: 81%; }
#recruit .slider #blk-main{
   padding: 0;
}
@media screen and (max-width: 780px) {
   .interview-ttl img{ 
      width: 92%;
      margin: 7rem 0 2rem;
   }
   .recruit #blk-main {
      margin-top: 6vw;
   }

}

#instagram {
    background: #fff;
}
.instagram-ttl img{ 
   width: 100%;
   margin-top: -25vw;
}
.instagram-ttl{ position: relative;}
.instagram-ttl p {
    text-align: center;
    position: absolute;
    top: 47%;
    left: 0;
    width: 100%;
}
.btn.yel{ background: #fff9b0; }
.pb100{
   padding-bottom: clamp(50px, 13vw, 100px);
}
.pb200{
   padding-bottom: 20.0rem;
}
.bg-news{
   background-image: url(../img/recruit/bg-news.png);
   margin-top: -8vw;
   background-position: right top;
   z-index: -1;
}
#interview {
   background: #fff;
}
.bg-interview{
   background-image: url(../img/recruit/bg-interview.png);
   background-position: left top;
   height: 126vw;
   margin-top: -19vw;
   background-size: cover;
}
.pb350{
   padding-bottom: 35vw;
}
@media screen and (max-width: 780px) {
   .pb200{
      padding-bottom: 36vw;
   }
   #instagram{
      padding-top: 17vw;
   }
   #instagram .btn{
      padding: 11px 20px;      
   }
   .interview-ttl p{
      position: relative;
   }
   .bg-interview{
      background-image: url(../img/recruit/bg-interview_sp.png);
      height: 280vw;
   }
   .instagram-ttl img {
    width: 87%;
    margin-top: -30vw;
    margin-left: auto;
    display: block;
    margin-bottom: 3vw;
   }
   .instagram-ttl p {
      position: relative;
   }
}

/* ---------- entry ---------- */
.entry.page h1{
   right: auto;
   left: 8%;
   top: 22%;
}
#entryEssentials{
   margin-top: -70px;
}
#entryEssentials .inner{
   background: #fff;
   padding: 7rem 9rem;
   border-radius: 5rem;
}
#newGraduate .h2{
   text-align: center;
   font-weight: 600;
}
.page #newGraduate h2 {
    font-size: 3.5rem;
    line-height: 1.3;
    letter-spacing: 0.1em;
}
.h2sub {
    color: #ffe051;
    font-size: 2.1rem;
}
.recruit_item a {
    display: flex;
    justify-content: space-between;
}
.recruit_item a::after{
   content: "";
   background: url(../img/recruit/entry/arrow.png) center / contain no-repeat;
   width: 4rem;
   height: 4rem;
}
.single .btn.btn-entry {
    margin: 0;
    background: #ffee5a;
}
.single .btn.btn-entry::after {
   background: url(../img/recruit/entry/arrow_wh.png) center / contain no-repeat;
   width: 3rem;
   height: 3rem;
}
.single .btn.back {
    background: #ffee5a;
}
.btn.back::after { content: none; }
.btn.back::before {
    content: "";
    display: inline-block;
    width: 17px;
    height: 17px;
    background: url(../img/recruit/btn-triangle.png) center / contain no-repeat;
    margin-right: 45px;
    transform: rotate(180deg);
}
.single .recruit_item a::after{
   content: none;
}
.recruit .color-key{
   color: #ffee5a !important;
    -webkit-text-stroke: 1px black;
}
.recruit.entry.single .mb90{
   margin-bottom: 4rem;
   font-weight: 600;
}
.recruit.entry.single #newGraduate{
   margin-bottom: 0;
}

@media screen and (max-width: 780px) {
   .recruit.entry #mv-page{ margin-top: 0; }
   .entry.page h1{
      width: 89%;
      top: 85%;
      left: 5%;
   }
   #entryEssentials{
      margin-top: 0;
   }
   #entryEssentials .inner{
      width: 94%;
      padding: 11vw 5vw;
      border-radius: 7vw;
   }
   .page #newGraduate h2 {
      font-size: 6vw;
      margin-bottom: 7vw;
   }
   .h2sub {
      font-size: 3.5vw;
   }
   .recruit_item a:after{
      width: 7vw;
   }
   .btn.back::before {
      margin-right: 7vw;
   }
   .entry #newGraduate{
      margin-bottom: 4vw;
   }
   .recruit.entry.single .mb90{
      font-size: 3.6vw;
      margin-bottom: 6vw;
   }
   .recruit.entry.single .txt-24{ font-size: 4.6vw; }
}

/* job */
.job #mv-page {
   z-index: 1;
}
.recruit.job #mv-page .bg-mv {
    background-image: url(../img/recruit/job/mv.png);
   aspect-ratio: 1440 / 823;    
}
.job.page h1 {
    top: 53%;
    left: 8%;
    right: auto;
}
#education {
    margin-top: -4vw;
}

.job .flex-box{
   gap: 1rem;
   align-content: flex-start;
}
.job .flex-box h2{
   align-items: center;
   gap: 2.5rem;
   font-weight: 600;
}
.job .flex-box h2 span{
   font-size: 3.6rem;
   color: #ff586b;
   font-weight: 800;
}
.job #education > .flex:has(.flex-box){
   gap: 6rem;
   margin-top: -10rem;
   margin-bottom: 7rem;
   z-index: 1;
   position: relative;
}
.fukidashi .txt{
    width: 45rem;
    padding: 5rem 6rem 6rem;
    background: #ff6375;
    color: #fff;
    border-radius: 5rem;
    border: solid 1px #000;
    gap: 1rem;
  position: relative;
  margin-left: 20px;
}
.fukidashi .txt::before,.fukidashi .txt::after,
.fukidashi .txt span::before,.fukidashi .txt span::after {
   content: "";
   position: absolute;
   top: 35%;
   left: 0;
   border-style: solid;
   translate: -100% -50%;
}
.fukidashi .txt::before,
.fukidashi .txt span::before {
  border-width: 22px 35px 22px 0;
  border-color: transparent #000000 transparent transparent;
}
.fukidashi .txt::after,
.fukidashi .txt span::after {
  border-width: 21px 33px 21px 0;
  border-color: transparent #ff6375 transparent transparent;
}
.fukidashi .txt span{
    width: 100%;
    height: 100%;
    background: #fffbc4;
    border: solid 1px #000;
    position: absolute;
    border-radius: 5rem;
    z-index: -1;
    top: 2rem;
    left: 2rem;   
}
.fukidashi .txt span::after {
  border-color: transparent #fffbc4 transparent transparent;
}
.fukidashi{
   position: relative;
   margin-left: -24rem;
   top: 4rem;
   z-index: 1;
}
.fukidashi::before{
   content: "";
   background: url(../img/recruit/job/solution-ttl-before.png) center / contain no-repeat;
   width: 47rem;
   height: 50rem;
   position: absolute;
   z-index: -2;
   top: 37%;
   left: 12%;
}
.fukidashi::after {
    content: "";
    background: url(../img/recruit/job/solution-ttl-after.png) center / contain no-repeat;
    width: 26rem;
    height: 32rem;
    position: absolute;
    z-index: 0;
    top: 41%;
    right: 5%;
}
.fukidashi .h2sub{
   color: #fff;
   font-size: 1.8rem;
   font-weight: 600;
}
.page .fukidashi h2 {
    font-size: 3.5rem;
    margin-bottom: 2rem;
}

#device img {
   width: 95vw;
    margin-left: auto;
    display: block;
}
#tools, #office {
    background: #fff;
}
#tools{ margin-top: 5vw; }
#tools img{ margin-top: -14.3vw; }


#office {
    margin-top: -4vw;
}
.page #office .h2 {
   text-align: center;
   font-weight: 600;
}
.page #office h2 {
    font-size: 3.5rem;
    line-height: 1.3;
    letter-spacing: 0.1em;
}
#office .h2sub{
   color: #9de2ff;
}

/*あとで消す*/
/* #education article img { width: 97vw; } */
#chart img, #tools img{ width: 100vw; }

/* #office .slide-arrow {
    background: url(../img/recruit/job/arrow.png) center / contain no-repeat;
    width: 5rem;
    height: 5rem;
    position: absolute;
    top: calc(50% - 2.5rem);
    z-index: 1;
}
#office .prev-arrow {
   left: 20rem;
}
#office .next-arrow {
   right: 20rem;
   transform: rotate(180deg);
}
#office .slick-dots{
   position: relative;
   bottom: -9rem;
   width: 13%;
}
#office .text-slider-office {
    margin-top: -2rem;
}
#office h2.line {
    font-size: 2.2rem;
    font-weight: 600;
    text-decoration: underline 8px;
    text-decoration-color: #ffee5a;
    text-underline-offset: -3px;
}
.text-slider-office .flex{
   gap: 12rem;
} */
@media screen and (max-width: 780px) {
.job #mv-page{
   margin-top: 0;
}
.recruit.job #mv-page .bg-mv {
   background-image: url(../img/recruit/job/mv_sp.png);
   aspect-ratio: 719 / 754;
   width: 96%;
   margin-left: auto;
}
.job.page h1{
   width: 70%;
   left: 4%;
   top: 60%;
}
#education {
   margin-top: -17vw;
}
#education article img, #device img{ width: 100vw; }
.f-w30{ width: 85%; margin: 0 auto;}
.job .flex-box{
   gap: 1vw;
}
.job .flex-box h2{
   font-weight: 700;
   font-size: 4.2vw;
   gap: 3vw;
}
.job .flex-box h2 span{
   font-size: 6vw;
}
.job #education > .flex{
   gap: 14vw;
   margin-top: -13vw;
   margin-bottom: 16vw;
}
.fukidashi{
   top: 0;
    margin: -26vw auto 20vw;
}
.fukidashi .txt{
   width: 87vw;
    padding: 9vw 11vw;
    margin: 0 auto 3vw;
    border-radius: 6vw;
    justify-content: center;
    gap: 0;
}
.fukidashi .h2sub{
   font-size: 3vw;
    text-align: center;
}
.page .fukidashi h2{
   font-size: 6.8vw;
    text-align: center;
}
.fukidashi p {
    font-size: 3.3vw;
    font-weight: 300;
}
.fukidashi .txt::before,
.fukidashi .txt span::before {
  border-width: 35px 20px 0;
  border-color: #000000 transparent transparent transparent;
}
.fukidashi .txt::after,
.fukidashi .txt span::after {
  border-width: 34px 19px 0;
  border-color: #ff6375 transparent transparent transparent;
}
.fukidashi .txt span::after {
  border-color: #fffbc4 transparent transparent transparent;
}

.fukidashi .txt::before,.fukidashi .txt::after,
.fukidashi .txt span::before,.fukidashi .txt span::after {
   top: 100%;
   left: 50%;
   translate: -50% 0;
}
.fukidashi .txt span{
   border-radius: 6vw;
   top: 3vw;
   left: 3vw;
}
.fukidashi::before{
   background: url(../img/recruit/job/solution-ttl-before_sp.png) center / contain no-repeat;
   width: 41vw;
   height: 45vw;
   top: 66%;
   right: -7vw;
   left: auto;
}
.fukidashi::after {
   background: url(../img/recruit/job/solution-ttl-after_sp.png) center / contain no-repeat;
   width: 37vw;
   height: 39vw;
   top: -12vw;
   left: -4vw;
}


#device {
   margin-top: 7vw;
}
#chart {
   margin-top: -3vw;
}
#tools{
   margin-top: -16vw;
}
#office{
   margin-top: -8vw;
}
.page #office h2 {
   font-size: 6vw;
   margin-bottom: 7vw;
}
/* #office .text-slider-office {
    margin-top: -7vw;
    margin-bottom: 27vw;
}

#office h2.line {
   font-size: 4vw;
   margin-bottom: 4vw;
}
.text-slider-office .flex{
   display: block;
}

#office .slick-dots{
   width: 40vw;
   bottom: -30vw;
}
#office .slick-dots li button{
   width: 4vw;
   height: 4vw;
}
#office .slick-dots li button:before{
   font-size: 2.4vw;
}
#office .slide-arrow {
   width: 6.4vw;
   height: 6.4vw;
   top: calc(50% - 3.2vw + -5vw);
}
#office .prev-arrow {
   left: 5vw;
}
#office .next-arrow {
   right: 5vw;
} */
}

/*あとでけす*/
.no-link{
   pointer-events: none;
   color: #bbb;
}
.pb350 {
    padding-bottom: 18vw;
}
@media screen and (max-width: 780px) {
   .pb350 {
      padding-bottom: 18vw;
   }
   .recruit #blk-main {
      margin-top: 0;
   }
}
.instagram-ttl p {
   margin-top: -12vw;
}