@charset "UTF-8";
:root {
	 /* サイズ定義 */
	--w_90size:90%;
	--h_90size:90%;
	 /* フォントサイズ定義 */
	--h2_size:2.375em;/* h2 38pt */
	--p_14size:0.875em;/* 14pt */
	--p_17size:1.0625em;/* 17pt */
	--p_22size:1.375em;/* 22pt */
	--p_28size:1.75em;/* 28pt */
	--p_34size:2.125em;/* 34pt */
	--p_46size:2.875em;/* 46pt */
	--p_54size:3.375em;/* 54pt */

	 /* カラー定義 */
	--c_main: #3D5552; /* 濃いグリーン */
	--c_white: var(--color-bg); /* 白 */
	--c_pink: #FF6565; /* ピンク */
	--c_beige: var(--color-bg-soft); /* ベージュ */
	--c_gr_red: linear-gradient(90deg, rgba(203,67,63,1) 0%, rgba(255,66,82,1) 100%); /* グラデーション赤 */
	--c_gr_red-invert: linear-gradient(-90deg, rgba(203,67,63,1) 0%, rgba(255,66,82,1) 100%); /* グラデーション赤 反転 */

	/* カラム数定義 */
	--col3: calc(100%/3);/* カラム数3 */
	--col2: calc(100%/2);/* カラム数2 */
	--col1: calc(100%/1);/* カラム数1 */
	--col3_y: calc(100%/3 - 4%);/* カラム数3 余白あり */
	--col2_y: calc(100%/2 - 4%);/* カラム数2 余白あり */
	--col1_y: calc(100%/1 - 4%);/* カラム数1 余白あり */

	/* 背景定義 */
	--bg_center_cover: no-repeat center/cover; /* 繰り返しなし 中央カバー */
	--bg_center_contain: no-repeat center/contain; /* 繰り返しなし 中央コンタイン */
	--bg_bottom_cover: no-repeat center bottom/cover; /* 繰り返しなし 下揃えカバー */
	--bg_bottom_contain: no-repeat center bottom/contain; /* 繰り返しなし 下揃えコンタイン */
  }
body {
	/* 2026-10-01追記: ここにfont-familyが無かったため、.ft-ntj/.ft-os/.ft-hd
	   で明示的に上書きされていない要素（header.php/footer.phpが出す共通の
	   ヘッダー・フッターなど、<main class="ft-ntj">の外側にあるパーツ）が
	   ブラウザのデフォルトフォント（指定なし＝serif相当）のまま表示されていた。
	   PC/Android等ではCJKグリフのフォールバック先がゴシック系になるため
	   気付きにくいが、iOS Safariはこのフォールバックが明朝体になるため、
	   iPhoneで見ると共通ヘッダー・フッターだけ明朝で表示される不具合の原因
	   だった。他ページと合わせてvar(--font-jp)を明示する。 */
	font-family: var(--font-jp);
	color: var(--c_main);
	line-height: var(--lh-jp-h-xs-pc);
    font-feature-settings: "palt";
}
p {
	text-align: justify;
}
img {
	width: 100%;
	display: block;
}
a {
	text-decoration: none;
	color: var(--c_main);
}
.ft-os {
	font-family: "Oswald","Noto Sans JP", sans-serif!important;
  	font-optical-sizing: auto;
  	font-style: normal;
}
.ft-hd {
	font-family: "Hind","Noto Sans JP", sans-serif!important;
  	font-style: normal;
}
.ft-ntj {
	font-family: "Noto Sans JP", sans-serif!important;
  	font-optical-sizing: auto;
  	font-style: normal;
}
.ft-up {
	-ms-writing-mode: tb-rl;
	writing-mode: vertical-rl;
  }

.flex {
	display: flex;
	width: 100%;
}
.flex.wrap {
	flex-wrap: wrap;
}
.step{
	counter-reset: number 0;
}
.step .number:before{
	counter-increment: number 1;
  	content: "0"counter(number);
	display: block;
}
a.more,button.more,
.company .company_item a .more,
.company .company_item button .more, 
.interview .staff .staff_item a .more, 
.interview .staff .staff_item button .more {
	color: var(--c_white);
	padding: 0 1.3em 0.2em;
	line-height: 1.5;
	border-radius: 3em;
	background-color: var(--c_pink);
	transition: 0.2s transform,0.2s background;
	display: block;
}


.fv .fv_top {
	position: relative;
	background: url(../img/recruit/fv_bg.webp) var(--bg_center_cover);
	height: clamp(0px, 100svh, 45em);
	padding: 1em 0;
	box-sizing: border-box;
}
.fv .fv_top h1 {
	font-size: 11.375em;
	text-align: center;
	color: var(--c_pink);
	margin: 0.5em auto 0;
	mix-blend-mode: multiply;
	letter-spacing: 0.3em;
}
.fv .fv_top h1 .line {
	font-size: 0.2em;
	display: block;
	position: relative;
	width: 4.2em;
	margin: 0 auto;
	letter-spacing: 0.3em;
}
.fv .fv_top h1 .line:before,.fv .fv_top h1 .line:after {
	content: '';
	display: block;
	width: var(--w_90size);
	height: var(--h_90size);
	position: absolute;
	border-width: 3px!important;
}
.fv .fv_top h1 .line:before {
	border-top: solid;
	border-left: solid;
	top: 0;
	left: -0.3em;
}
.fv .fv_top h1 .line:after {
	border-bottom: solid;
	border-right: solid;
	bottom: 0;
	right: 0;
}
.fv .fv_top .logo {
	width: 14.375em;
	margin: 3em auto;
}
.fv .fv_txt-com .catch {
	width: 46.875em;
	margin: -3.5em auto 0;
	position: relative;
}
.fv .fv_txt-com p {
	font-size: 1.25em;
	text-align: center;
	line-height: var(--lh-jp-bd-pc);
	margin: 3em auto;
}
.fv .fv_txt-com .tagline-img {
	width: 100%;
	overflow: hidden;
	pointer-events: none;
}
.fv .fv_txt-com .tagline-img img {
	width: clamp(100em, 100%, 100%);
	margin-left: 50%; /* 親の中央に基準を合わせる */
	transform: translateX(-50%); /* その基準から左に50%動かして中央配置 */
}
.fv .fv_txt-com .tagline-img + * {
	margin-top: -11.5em;
}

.about {
	position: relative;
	padding: 6em 0 10em;
	overflow: hidden;
}
.about::before {
	content: '';
	display: block;
	width: calc(100%/2 + 12em);
	height: 100%;
	background-color: var(--c_beige);
	position: absolute;
	right: 0;
	top: 0;
	z-index: -1;
}
.about .inner {
	max-width: 1200px;
	width: var(--w_90size);
	margin: 0 auto;
}
.about .inner > * {
	width: calc(100%/2 - 3%);
	margin: 0 auto;
}
.about .inner .ttl {
	font-size: var(--h2_size);
	text-align: right;
	padding: 0 1em;
	box-sizing: border-box;
	position: relative;
}
.about .inner .ttl:after {
	content: '';
	display: block;
	width: 100%;
	aspect-ratio: 565/375;
	background: url(../img/recruit/about.webp?set2026) var(--bg_center_cover);
	position: absolute;
	top: 0.7em;
	left: 0;
	z-index: -1;
}
.about .inner .txt-com h4 {
	font-size: var(--p_22size);
	font-weight: 500;
	margin: 0 auto 1.5em;
}

/* コンテナ */
.work_slide {
	position: relative;
	width: 100%;
	height: 29.875em;
	padding: 2em 0;
	box-sizing: border-box;
	overflow: hidden;
	background: url(../img/recruit/green-bg.webp) var(--bg_center_cover);
	align-items: center;
	color: var(--color-border);
}

.work_slide:before{
	content: attr(data-title);
	display: block;
	width: 100%;
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%,-50%);
	text-align: center;
	font-size: 4.25em;
	letter-spacing: 0.3em;
	z-index: 4;
}

  /* スライダーのラッパー */
  .slider {position: relative;
	height: 100%;
	width: 100%;
}
  
  /* 各画像 */
  .slider img {
	width: clamp(110em, 100%, 100%);
	height: auto;
	position: absolute;
	top: 0;
	bottom: 0;
  }
  
  /* 画像1: 再背面 */
  .image1,  .image4 {
	z-index: 1;
  } 
  .image1 {
	animation: slide1 30s linear infinite;
  } 
  .image4 {
	animation: slide2 60s linear infinite;
  }
  
  /* 画像2: 中央 */
  .image2,  .image5 {
	z-index: 2;
  } 
  .image2 {
	animation: slide1 30s linear infinite;
  }
  .image5 {
	animation: slide2 60s linear infinite;
  }
  
  /* 画像3: 最前面 */
  .image3,  .image6 {
	z-index: 3;
  }
  .image3 {
	animation: slide1 29s linear infinite;
  }
  .image6 {
	animation: slide2 58s linear infinite;
  }
  
  /* 右から左へのアニメーション */
  @keyframes slide1 {
	0% {
	  transform: translateX(100%);
	  opacity: 0;
	}
	10% {
		opacity: 1;
	  }
	90% {
		opacity: 1;
	  }
	100% {
	  transform: translateX(-100%);
	  opacity: 0;
	}
  }
    /* 右から左へのアニメーション */
@keyframes slide2 {
		0% {
			transform: translateX(100%);
			opacity: 0;
		}
		25% {
			transform: translateX(100%);
			opacity: 0;
		}
		30% {
			opacity: 1;
		  }
		75% {
		  transform: translateX(-100%);
		}
		90% {
			opacity: 1;
		  }
		100% {
		  transform: translateX(-100%);
		  opacity: 0;
		}
}



.company .inner {
	max-width: 1000px;
	width: var(--w_90size);
	margin: 5em auto;
}
.company .inner .ttl {
	font-size: var(--h2_size);
	color: var(--c_pink);
}
.company .company_item {
	display: flex;
	flex-direction:column;
	margin-right: 5%;
	box-sizing: border-box;
	width: var(--col3_y);
}
.company .company_item:last-child {
	margin-right: 0%;
}
.company .company_item h4 {
	font-weight: 500;
	margin: 1em 0;
	
}
.company .company_item .bg {
	line-height: 2;
	flex-grow:1;
	aspect-ratio: 1/1.2;
	box-sizing: border-box;
	padding: 2.5em;
	font-weight: 600;
	color: var(--c_white);
	position: relative;
}
.company .company_item .bg:before {
	content: '';
	display: block;
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	background: var(--color-dark) var(--bg_center_cover);
	pointer-events: none;
	z-index: -1;
}
.company .company_item:nth-child(1) .bg:after,.company .company_item:nth-child(2) .bg:after {
    content: '';
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    mix-blend-mode: multiply;
    z-index: -1;
}
.company .company_item:nth-child(1) .bg:before {
	background-image: url(../img/recruit/com_view01.webp);
	filter: grayscale(1);
	background-position: 50% 40%;
}
.company_item:nth-child(1) .bg:after {
    background: #909090;
}
.company .company_item:nth-child(2) .bg:before {
	background-image: url(../img/recruit/com_view02.webp);
	filter: grayscale(1);
	background-position: 50% 42%;
}
.company_item:nth-child(2) .bg:after {
    background: #666;
}
.company .company_item:nth-child(3) .bg:before {
	background-image: url(../img/recruit/shira.webp);
	filter: grayscale(1);
}

.company .company_item .bg ul li {
	list-style-type: disc;
	line-height: 1.5;
}
.company .company_item .more {
	position: absolute;
	right: 1.5em;
	top: 1.5em;
	font-size: var(--p_14size);
	filter: grayscale(0);
}
.company .value {
	margin: 2em auto;
	overflow: hidden;
}
.company .value .step {
	border-top: 1px solid;
	border-bottom: 1px solid;
	margin: 1.5em auto;
	padding: 1em 0;
}
.company .value .step li {
	width: var(--col3);
	margin: 0 auto;
	transform:skewX(-25deg);
	text-align: center;
	border-right: 1px solid;
	box-sizing: border-box;
	position: relative;
}
.company .value .step li > * {
	transform:skewX(25deg);
	padding: 1.5em 1em;
	box-sizing: border-box;
}
.company .value .step li:nth-child(3n) {
	border-right: 0;
}
.company .value .step li:nth-child(n+4){
	margin-top: 2em;
}
.company .value .step li:nth-child(n+4)::before{
	content: '';
	display: block;
	width: calc(100% + 2px);
	height: 1px;
	border-top: 1px solid;
	position: absolute;
	left: calc(50% - 1.2em);
	top: -1em;
	transform: translateX(-50%);
}
.company .value .step .number:before{
	font-weight: 700;
	color: var(--c_pink);
}

.interview {
	background: var(--c_gr_red);
	padding: 1em 0;
	position: relative;
	overflow: visible;
}
.interview:before {
	content: '';
	display: block;
	width: 100%;
	height: 120%;
	position: absolute;
	top: 0;
	left: 0;
	background: url(../img/recruit/int_bg.webp) var(--bg_center_cover);
	mix-blend-mode: screen;
	opacity: 0.2;
}
.interview .inner {
	max-width: 1120px;
	width: var(--w_90size);
	margin: 0 auto 4em;
	position: relative;
}
.interview .top {
	color: var(--c_white);
	margin: 2em auto;
	padding: 4em 0;
	align-items: center;
	background: url(../img/recruit/int_ttl_bg.webp) var(--bg_center_contain);
}
.interview .top h3 {
	font-size: var(--p_54size);
	margin-right: 1em;
}
.interview .top p {
	font-size: var(--p_17size);
	max-width: 41.25em;
	width: 50%;
}

.interview .staff .staff_item {
	width: var(--col3_y);
	background: var(--c_white) var(--bg_center_cover);
	position: relative;
	aspect-ratio: 1/1.4;
	margin: 1em auto;
}
.interview .staff .staff_item, .interview .staff .staff_item a,.staff .staff_item img {
	border-radius: 1em;
}
.interview .staff .staff_item .catch {
	background: var(--c_main);
	color: var(--c_white);
	padding: 0.8em 0.2em;
	position: absolute;
	left: 1.5em;
	top: -1.5em;
}
.interview .staff .staff_item .position,
.interview .staff .staff_item a .more,
.interview .staff .staff_item button .more  {
	position: absolute;
	right: 1.5em;
}
.interview .staff .staff_item .catch, .interview .staff .staff_item .position,.interview .staff .staff_item img {
	z-index: 1;
	pointer-events: none;
}
.interview .staff .staff_item .position {
	padding: 0.8em 0.2em;
	text-align: right;
	bottom: 2.5em;
	font-size: var(--p_17size);
	width: 60%;
	line-height: 1.5;
}
.interview .staff .staff_item .position .year {
	font-size: var(--p_14size);
}
.company .company_item a, .interview .staff .staff_item a,
.company .company_item button, .interview .staff .staff_item button {
	overflow: hidden;
	bottom: 0;
	width: 100%;
	height: 100%;
	display: block;
	position: absolute;
	left: 0;
	top: 0;
}
.interview .staff .staff_item img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.interview .staff .staff_item a .more, 
.interview .staff .staff_item button .more{
	bottom: 1em;
}
.interview .staff .swiper-pagination-clickable {
   display: none;
}

.rec-movie {
    padding: 0 0 5em;
}
.rec-movie .inner {
	max-width: 1120px;
	width: var(--w_90size);
	margin: 0 auto!important;
	position: relative;
	padding: 0 10em;
	box-sizing: border-box;
}

.descriptions {
	background-color: var(--c_beige);
	padding: 1em 0;
}
.descriptions .inner {
	max-width: 1040px;
	width: var(--w_90size);
	margin: 0 auto;
}
.descriptions .top {
	margin: 5em auto;
}
.descriptions .top .ttl {
	font-size: var(--p_22size);
	letter-spacing: 0.2em;
	margin-bottom: 2em;
	text-align: center;
}
.descriptions .top p {
	font-size: var(--p_17size);
	text-align: center;
}

.tab {
	width: 100%;
	margin: auto;
}
.tab_lbl {
	width: var(--col3_y);
	text-align: center;
	display: block;
	float: left;
	order: -1;
	background-color: var(--c_white);
	padding: 1em 1em 1.5em;
	box-sizing: border-box;
	border: 2px solid var(--c_white);
	transition: 0.2s border,0.2s transform;
	position: relative;
}
.tab_lbl.point-none {
    pointer-events: none;
}
.tab_lbl.point-none:after {
    content: '';
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background: #a6a6a6;
    mix-blend-mode: multiply;
    opacity: 0.5;
}
.tab_lbl.point-none span {
}
.tab_lbl:nth-of-type(2){
	margin: 0 auto;
}
.tab_lbl:before {
	content: attr(data-title);
	font-size: var(--p_22size);
	font-weight: 500;
	display: block;
	margin-bottom: 0.2em;
}
.tab_lbl span {
	font-size: var(--p_14size);
	background-color: var(--color-bg-soft);
	padding: 0.2em 1em;
	transition: 0.2s background-color;
}
   
input:checked + .tab_lbl {
	border: 2px solid;
}
input:checked + .tab_lbl span {
	background-color: #FFFF00;
}
   
.tab_con {
	display: none;
	width: 100%;
	background-color: var(--c_white);
	margin: 2em auto;
	padding: 3em 4em;
	box-sizing: border-box;
}
input:checked + .tab_lbl + .tab_con {
	display: block;
}	

.descriptions .tab_con h4 {
	font-size: var(--p_22size);
	margin-bottom: 1em;
}
.descriptions .tab_con h4 + p {
	font-size: var(--p_17size);
}
.descriptions .tab_con table {
	margin: 3em auto 2em;
	width: 100%;
}
.descriptions .tab_con table tr {
	border-top: 1px solid;
	box-sizing: border-box;
}
.descriptions .tab_con table tr:last-child {
	border-bottom: 1px solid;
}
.descriptions .tab_con table th {
	padding: 1em 0.5em;
	box-sizing: border-box;
	font-weight: 500;
	text-align: justify;
}
.descriptions .tab_con table td {
	padding: 1em 0.5em;
	box-sizing: border-box;
	text-align: justify;
}
.descriptions .target {
	align-items: flex-start;
	margin: 2em auto;
}
.descriptions .target h4 {
	font-weight: 500;
	border-bottom: 1px solid;
	padding-bottom: 1em;
	margin: 0 auto;
}
.descriptions .target ul {
	width: 70%;
}
.descriptions .target li {
	list-style-type: disc;
	line-height: 2;
}
.descriptions .entry_btn {
	width: 70%;
	margin: 4em 0 4em auto;
}
.descriptions .entry_btn a {
	font-size: var(--p_22size);
	text-align: center;
	border: 2px solid;
	display: block;
	box-sizing: border-box;
	padding: 1em 4em;
	background-color: #FFFF00;
	width: 22.7em;
	position: relative;
	transition: 0.2s background-color,0.2s color;
}
.descriptions .entry_btn a:after {
	content: '';
	display: block;
	width: 1em;
	aspect-ratio: 1/1;
	background: url(../img/recruit/arrow_icon.webp) var(--bg_center_contain);
	position: absolute;
	top: 50%;
	right: 3em;
	transform: translateY(-50%);
	transition: 0.2s filter, 0.2s right;
}

.descriptions .join {
	position: relative;
	margin: 10em 0 -10em;
	overflow: hidden;
}
.descriptions .join:before {
	content: '';
	display: block;
	max-width: 1200px;
	width: 100%;
	aspect-ratio: 1/0.267;
	background: url(../img/recruit/all_member.webp?set260317) var(--bg_center_contain);
	position: absolute;
	left: 0;
	right: 0;
	bottom: 1em;
	margin: 0 auto;
	z-index: 1;
}
.descriptions .join p {
	text-align: center;
}
.descriptions .join p.catch {
	font-size: var(--p_22size);
	line-height: 2;
}
.descriptions .join p.ft-hd {
	font-size: 9.375em;
	color: var(--c_pink);
	font-weight: 500;
	transform: skewX(-10deg);
	position: relative;
	line-height: 1;
	padding: 0.3em 0;
	letter-spacing: -2px;
}
.descriptions .join p.ft-hd:before {
	content: '';
	display: none;
	width: 1.5em;
	aspect-ratio: 1/1;
	background: url(../img/recruit/join.webp) var(--bg_center_contain);
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%,-50%) skewX(10deg);
	z-index: -1;
}

.flow {
	margin: 15em auto 5em;
}
.flow .inner,.qa .inner {
	max-width: 1120px;
	width: var(--w_90size);
	margin: 0 auto;
}
.flow h3,.qa h3 {
	font-size: var(--p_22size);
	font-weight: 500;
	margin: 1em auto;
	width: 7em;
}
.flow .txt-com,.qa .txt-com {
	width: calc(80% - 7em);
}
.flow .txt-com .step li {
	font-size: var(--p_22size);
	display: flex;
	flex-wrap: wrap;
	padding: 1em;
	border-bottom: 1px solid;
}
.flow .txt-com .step .number {
	width: 6em;
}
.flow .txt-com .step .number:before {
	content: "step."counter(number);
	font-size: 0.8em;
}
.flow .txt-com .step .right {
	width: calc(100% - 6em);
	display: flex;
	flex-wrap: wrap;
	align-items: center;
}
.flow .txt-com .step .right a {
	font-size: 0.8em;
	margin: 0 0 0 auto;
	font-weight: 500;
	padding-right: 2.6em;
	position: relative;
}
.fv .entry_btn a:before,.flow .txt-com .step .right a:before, footer .entry_btn a:after, .pop-more .other_btn a:before, .pop-more .other_btn button:before  {
	content: '';
	display: block;
	width: 2em;
	height: 2em;
	aspect-ratio: 1/1;
	background: url(../img/recruit/arrow_icon02.webp) var(--bg_center_contain);
	background-size: 150%;
	position: absolute;
	right: 0;
	top: 50%;
	transform: translateY(-50%);
	border-radius: 50%;
	border: 2px solid var(--c_pink);
	transition: 0.2s transform, 0.2s right;
}
.pop-more .other_btn a:first-child:before {
    transform: translateY(-50%) scale(-1);
}
.flow .txt-com .step .sub {
	font-size: 0.72em;
	background-color: var(--color-bg-soft);
	padding: 0 0.5em;
	display: block;
	margin: 0 1em;
}
.flow .txt-com .step .note {
	font-size: 0.63em;
	width: 100%;
	margin: 1em 0;
}

.qa {
	background: var(--c_beige);
	padding: 5em 0;
}
.qa .qa_item {
	border-bottom: solid;
	padding: 1em;
	box-sizing: border-box;
}

/*ボックス全体*/
.accbox {
    margin: 1em 0;
    padding: 0;
}

/*ラベル*/
.accbox label {
    display: block;
    cursor :pointer;
    transition: all 0.5s;
	font-size: var(--p_17size);
	position: relative;
	padding-left: 3em;
}
.accbox label .toggle {
	width: 1em;
	aspect-ratio: 1/1;
	display: block;
	position: absolute;
	left: 0;
	top: 50%;
	transform: translateY(-50%);
	transition: 0.5s;
}
.accbox label .toggle:before,.accbox label .toggle:after {
	content: '';
	width: 100%;
	height: 3px;
	background-color: var(--c_main);
	display: block;
	border-radius: 1em;
	overflow: hidden;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);
}
.accbox label .toggle:after {
	transform: translate(-50%,-50%) rotate(90deg);
}
/*中身を非表示にしておく*/
.accbox .accshow {
    height: 0;
    padding: 0 0 0 3.5em;
    overflow: hidden;
    opacity: 0;
    transition: 0.8s;
	font-size: var(--p_14size);
}
/*クリックで中身表示*/
.acc_label:checked + label + .accshow {
    height: auto;
    padding: 1em 0 0 3.5em;
    opacity: 1;
}	
.acc_label:checked + label .toggle {
	transform: translateY(-50%) rotate(45deg);
}
.qa .note {
	font-size: var(--p_17size);
	margin: 1em auto;
}
.qa .note a {
	border-bottom: solid;
	padding-bottom: 0.2em;
}


footer {
	background: url(../img/recruit/green-bg.webp) var(--bg_center_cover);
	padding: 1em 0;
}
footer,footer a {
	color: var(--c_white);
}
footer .inner {
	width: var(--w_90size);
	max-width: 1060px;
	margin: 3em auto;
}
footer .inner .left,
footer .inner .right {
	width: var(--col2);
}
footer .logo {
	width: 8.875em;
	margin-bottom: 5em;
}
footer .add,
footer .copy,
footer .policy {
	font-size: var(--p_14size);
}
footer .add {
	margin: 3em auto;
}
footer .copy {
	color: #647775;
	margin-top: 2em;
}
footer .right {
	font-size: var(--p_17size);
	text-align: right;
}
footer .right a {
	display: block;
	width: fit-content;
	margin: 2em 0.2em 2em auto;
}
footer .entry_btn a {
	padding-right: 3em;
	position: relative;
}
footer .entry_btn a:after {
	filter: brightness(0) invert(100%);
}



/* 初期状態（モーダルが画面外にある） */
.pop {
	transition: transform 0.8s ease-out, opacity 0.5s ease-out;
	transform: translateX(100%);
	width: 100%;
	height: 100svh;
	position: fixed;
	top: 0;
	left: 0;
	background: var(--c_white);
	z-index: 10;
	overflow: scroll;
}
/* モーダルが開いた状態（画面内に移動） */
.pop.pop-open {
    transform: translateX(0);
    opacity: 1;
}
/* モーダルが閉じるとき（右側にスライドアウト） */
.pop.pop-close {
    transform: translateX(100%);
    opacity: 0;
}
.pop-close_btn,.pop-more {
	position: fixed;
	z-index: 11;
	pointer-events: none;
}
.pop-close_btn,.other_btn {
	opacity: 0;
}
.pop-close_btn.view,.other_btn.view {
	opacity: 1;
	pointer-events: all;
	transition: 0.3s opacity;
}
.pop-close_btn {
    border: 2px solid;
    border-radius: 50%;
    box-sizing: border-box;
    height: auto;
    aspect-ratio: 1/1;
    font-weight: 600;
    font-size: var(--p_14size);
    color: var(--c_main);
    width: 5.7em;
    right: 2em;
    top: 2em;
    overflow: hidden;
}
.pop-close_btn:before {
    content: '';
    display: block;
    width: 100%;
    aspect-ratio: 1/1;
    background: rgba(255,255,255,0.4);
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
}
.pop-more {
    top: 50%;
    left: 50%;
    width: 98%;
    height: 2.3em;
    max-width: 1300px;
    transform: translate(-50%,-50%);
}
.other_btn {
    justify-content: space-between;
    position: absolute;
    top: 0;
    left: 0;
}
.other_btn a,.other_btn button {
    position: relative;
    width: 2.3em;
    aspect-ratio: 1/1;
}

.txt-com.top-message {
    box-sizing: border-box;
    position: relative;
    overflow: hidden;
    display: flex;
    align-items: center;
    min-height: 100svh;
}
.txt-com.top-message::before {
    content: "";
    display: block;
    width: max(100%, 100vh);
    height: 30em;
    position: absolute;
    top: 0;
    left: 0;
    background: url(../img/recruit/green-bg.webp) var(--bg_center_cover);
    transform: rotate(-90deg) translate(-100%, 0);
    transform-origin: top left;
    z-index: -1;
}
.txt-com.top-message > .flex {
    padding: 6.575em 0;
    box-sizing: border-box;
    height: auto;
    margin: auto;
}
.txt-com.top-message .profile {
    width: 33.25em;
    color: var(--c_white);
    margin-right: -2.6em;
}
.txt-com.top-message .comment {
    width: calc(100% - 33.25em);
    position: relative;
    display: flex;
    flex-wrap: wrap;
}
.txt-com.top-message .comment:before {
    content: '';
    display: block;
    background: url(../img/recruit/logo_w.svg) var(--bg_center_contain);
    background-size: 42em auto;
    background-position: center 0;
    width: 17.5em;
    aspect-ratio: 1/1;
    position: absolute;
    z-index: -1;
    right: 7em;
    top: 1em;
    filter: brightness(0) saturate(100%) invert(97%) sepia(4%) saturate(429%) hue-rotate(4deg) brightness(105%) contrast(95%);
}
.txt-com.top-message .profile .img,.txt-com.top-message .profile p {
    margin: 0 0 0 auto;
}
.txt-com.top-message .profile .img {
    width: 20em;
    aspect-ratio: 1/1.2;
    position: relative;
    margin-bottom: 3em;
}
.txt-com.top-message .profile .img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.txt-com.top-message .profile .img:after {
    content: attr(data-title);
    text-align: left;
    display: block;
    width: 60%;
    font-weight: 500;
    font-size: var(--p_17size);
    position: absolute;
    left: 0;
    bottom: -2.5em;
}
.txt-com.top-message .profile p {
	width: 24.6em;
	padding-right: calc(40% - 8.8em);
	box-sizing: border-box;
	font-size: 0.8125em;
}
.txt-com.top-message .profile p .ft-hd {
	font-size: var(--p_14size);
}

.txt-com.top-message .comment .ttl {
    width: 81%;
    margin: 3em auto 3em 0;
    text-align: left;
    padding-left: 21%;
    position: relative;
    box-sizing: border-box;
    font-weight: 500;
}
.txt-com.top-message .comment .ttl:before {
    content: attr(data-title);
    display: block;
    font-size: 2.875em;
    transform: translateX(-3.8em);
    line-height: 1.5;
    width: calc(100% + 5em);
    font-weight: 700;
}
.txt-com.top-message .comment p {
    width: 63%;
    margin: 1em auto;
    font-size: var(--p_17size);
    line-height: 2;
}
.txt-com.top-message .comment p.name {
    text-align: right;
    margin: auto auto 0;
}
.txt-com.top-message .comment p.name span {
    font-size: var(--p_14size);
}

.txt-com.staff-message .top {
	position: relative;
}
.txt-com.staff-message .top .ttl {
	background: var(--c_gr_red);
	color: var(--c_white);
	font-weight: 500;
	max-width: 44.75em;
	width: 40%;
	padding: 3.5em 3em;
	padding-right: 10em;
	box-sizing: border-box;
	text-align: right;
	border-radius: 0 0 20em 0;
	position: absolute;
	z-index: 1;
}
.txt-com.staff-message .top .ttl .number {
	display: inline-block;
}
.txt-com.staff-message .top .ttl:before {
	content: attr(data-title);
	font-size: var(--p_54size);
	display: block;
	line-height: 1.2;
	font-weight: 700;
}
.txt-com.staff-message .top .ttl:after {
    content: '';
    display: block;
    width: 100%;
    height: 100%;
    background: url(../img/recruit/int_staff_ttl_bg.webp) var(--bg_center_cover);
    position: absolute;
    left: 0;
    top: 0;
    z-index: -1;
    mix-blend-mode: screen;
    opacity: 0.25;
}
.txt-com.staff-message .top .profile .img {
	width: 100%;
	aspect-ratio: 1/0.4;
	position: relative;
	max-height: 40.5em;
	margin: 0 auto;
	background: var(--color-bg-soft);
}
.txt-com.staff-message .top .profile .img img {
	height: 100%;
	width: auto;
	margin: 0 auto;
}
.txt-com.staff-message .top .profile .en,
.txt-com.staff-message .top .profile .more {
	position: absolute;
	bottom: 3em;
	transform: translateX(-50%);
}
.txt-com.staff-message .top .profile .en {
	color: var(--c_pink);
	font-size: var(--p_17size);
	text-align: right;
	line-height: 1.2;
	font-weight: 500;
	left: calc(50% - 20em);
}
.txt-com.staff-message .top .profile .en::before {
	content: attr(data-title);
	display: block;
	font-size: var(--p_54size);
	width: 5em;
	overflow-wrap: break-word;
}
.txt-com.staff-message .top .profile .more {
	width: 16.25em;
	left: calc(50% + 22em);
}
.txt-com.staff-message .top .profile .more p {
	font-size: var(--p_14size);
	line-height: 1.5;
}
.txt-com.staff-message .top .profile .more .name {
	font-size: 2.275em;
	line-height: 1;
	margin-left: -0.2em;
	margin-bottom: 1em;
} 
.txt-com.staff-message .profile .txt-com {
	font-size: var(--p_17size);
	line-height: 2;
}
.txt-com.staff-message .inner {
	max-width: 1120px;
	width: var(--w_90size);
	margin: 3em auto;
	align-items: flex-start;
}
.txt-com.staff-message .inner h5 {
	font-size: var(--p_22size);
	margin-bottom: 1em;
}
.txt-com.staff-message .interviwe_qa.inner {
	margin: 7em auto;
}
.interviwe_qa > .flex {
	align-items: center;
	margin: 10em auto;
}
.interviwe_qa > .flex > .flex {
	align-items: flex-start;
}
.interviwe_qa .flex.col2 > * {
	width: var(--col2);
}
.interviwe_qa .txt-com .q {
	font-size: var(--p_17size);
	color: var(--c_pink);
	border-left: 1px solid;
	padding-left: 2em;
	margin-bottom: 2em;
	box-sizing: border-box;
	position: relative;
	line-height: 1.6;
}
.interviwe_qa .txt-com .q:before {
	content: attr(data-title);
	display: block;
	color: #FFA7A7;
	margin-bottom: 3em;
}
.interviwe_qa .txt-com .q:after {
	content: '';
	display: block;
	width: calc(100vw/2 - 50%);
	height: 17em;
	background-color: var(--c_beige);
	position: absolute;
	right: 50%;
	top: 3em;
	z-index: -1;
}
.interviwe_qa .txt-com .a {
	padding: 0 2em;
	box-sizing: border-box;
	line-height: 2;
	width: 80%;
}
.interviwe_qa div.img {
    position: relative;
    padding-bottom: 6.875em;
    box-sizing: border-box;
}
.interviwe_qa div.img img {
    max-width: 42em;
    margin: 0;
    margin-left: auto;
}
.interviwe_qa div.img:after {
    content: '';
    display: block;
    width: calc(100vw / 2 - 30%);
    height: 23.5em;
    background: url(../img/recruit/green-bg.webp) var(--bg_center_cover);
    position: absolute;
    z-index: -1;
    bottom: 0;
    left: 30%;
}
.interviwe_qa .col1 .txt-com .q {
	margin-right: clamp(-20%, -15em, -15em);
	width: 50%;
}
.interviwe_qa .col1 .txt-com .a {
	margin-top: 4.5em;
}
.interviwe_qa .txt-com.col3 .a {
	width: 45%;
}
.interviwe_qa .txt-com.col3 .img {
    width: 23%;
    margin: auto 0 0 auto;
}
.interviwe_qa .txt-com.col2 .a {
	width: 70%;
}


.interview-pop dl.message {
	background: var(--c_main);
	color: var(--c_white);
	padding: 2em 0;
}

.interview-pop .message dt,
.interview-pop .message > .inner:before{
	width: 10.5em;
    aspect-ratio: 1 / 1;
	font-size: var(--p_17size);
	margin: -8.5em 2.5em 0;
}
.interview-pop .message > .inner {
    position: relative;
    width: 100%;
}
.interview-pop .message > .inner:before {
    content: '';
    display: block;
    background: var(--c_main);
    position: absolute;
    top: 0;
    left: 0;
    mix-blend-mode: multiply;
    opacity: 0.6;
}
.interview-pop .message dt {
	box-sizing: border-box;
	padding: 1.5em;
	display: flex;
	flex-wrap: wrap;
	align-items: self-end;
	position: relative;
	z-index: 7;
}
.interview-pop .message dt::before {
	content: attr(data-title);
	display: block;
	color: var(--color-border);
	margin-bottom: auto;
	width: 100%;
	letter-spacing: 0.2em;
}
.interview-pop .message dd.txt-com {
	width: 29.75em;
	margin: 0 2em;
	margin-right: -13em;
	position: relative;
	z-index: 1;
}
.interview-pop .message dd h5 {
	font-weight: 400;
}
.interview-pop .message dd.img {
	width: 33.125em;
	margin: auto 0 -5em auto;
	aspect-ratio: 1/1;
	overflow: hidden;
}




@media (max-width: 1200px){
	html > body {
		font-size: 1.33vw;
	} 
}
@media (max-width: 750px){
	html > body {
		font-size: 2.13vw;
	}
	/* 2026-10-01追記: 上の`html > body`指定はbody要素自身のfont-sizeしか
	   変えないため、rem単位（ルート=html要素基準）で組まれている共通の
	   ヘッダー・フッター・Contact us（header.php/footer.php側、
	   style.css・blocks.css）にはこのSP縮小が効いておらず、スマホ幅で
	   それらだけ約1.6倍大きく表示されていた。他ページ（renewal.css）と
	   同じ計算式をhtml要素自身にも効かせて揃える。 */
	html {
		font-size: 2.1333vw !important; /* 16px ÷ 750px × 100。renewal.cssと同じ式 */
	}
	.pc {
		display: none!important;
	}
	.sp {
		display: block;
	}
	:root {
	/* フォントサイズ定義 */
	--h2_size:4.375em;/* h2 70pt */
	}

	.fv .fv_top {
    background: url(../img/recruit/fv_bg_sp.webp) var(--bg_bottom_cover);
    display: flex;
    flex-wrap: wrap;
    height: clamp(calc(67.5em - 14em),calc(100svh - 4em), 67.5em);
    flex-direction: column;
}
.fv .fv_top h1 {
    font-size: 6.6875em;
    order: 2;
    margin: auto;
    margin-top: 0;
}
	.fv .fv_top .logo {
    order: 1;
    margin: 7em auto 1em;
}
.fv .fv_txt-com .catch {
    width: 92%;
}
	.fv .fv_top h1 .line:before, .fv .fv_top h1 .line:after {
    border-width: 2px !important;
}
.fv .fv_top h1 .line {
    font-size: 0.3em;
}
.fv .fv_txt-com p {
    line-height: var(--lh-jp-md-sp);
    margin: 1.4em auto 0.5em;
    font-size: var(--p_28size);
}
.fv .fv_txt-com .tagline-img img {
    width: 100%;
}
.fv .fv_txt-com .tagline-img + * {
    margin-top: -3.7em;
}
.about {
    padding: 6em 0;
}
.about::before {
    width: 100%;
    height: calc(100% - 25em);
    top: auto;
    bottom: 0;
}
.about .inner > * {
    width: 100%;
}
.about .inner .ttl {
    text-align: justify;
    padding: 0 0.5em;
}
.about .inner .ttl:after{
    position: relative;
    top: -0.9em;
    left: 1.1em;
}
.about .inner .txt-com h4 {
    font-size: var(--p_34size);
}
.about .inner .txt-com p {
    font-size: 1.4375em;
}
.work_slide:before {
    font-size: 3.8125em;
    letter-spacing: 0.2em;
}
.work_slide {
    height: 50em;
}
.slider img {
    width: auto!important;
    height: 100%;
}
.company .company_item {
    width: var(--col1);
    margin-right: 0;
}
.company .company_item h4 {
	font-size: var(--p_34size);
}
.company .company_item h4 {
	font-size: var(--p_34size);
}
.company .company_item .bg {
    aspect-ratio: 1/0.7;
	font-size: var(--p_28size);
}
.company .company_item:nth-child(3) .bg:before {
	background-image: url(../img/recruit/shira_sp.webp);
}
	
.company .value > p {
	font-size: var(--p_28size);
	text-align: center;
	margin: 2em auto;
}
.company .value .step li {
    width: var(--col2);
}
.company .value .step li > * {
	font-size: 1.4375em;
}
.company .value .step li:nth-child(2n) {
    border-right: 0!important;
}
.company .value .step li:nth-child(3n) {
    border-right: 1px solid;
}
.company .value .step li:nth-child(n+3) {
    margin-top: 3.2em;
}
.company .value .step li:nth-child(n+3)::before {
    content: '';
    display: block;
    width: calc(100% + 2px);
    height: 1px;
    border-top: 1px solid;
    position: absolute;
    left: calc(50% - 2.4em);
    top: -1.5em;
    transform: translateX(-50%);
}
.txt-com.top-message .profile {
    width: 72%;
    margin: 0 auto;
    padding-bottom: 3.6em;
}
.txt-com.top-message .profile p {
    width: 100%;
    font-size: var(--p_22size);
    padding-right: calc(40% - 3.5em);
}
.txt-com.top-message .profile .img {
    width: 100%;
    margin-bottom: 4.3em;
}
.txt-com.top-message .profile .img:after {
    font-size: var(--p_22size);
    left: 0;
}
.txt-com.top-message::before {
    height: 35em;
    width: 77em;
}
.txt-com.top-message .comment {
    width: 100%;
    padding: calc(68em + 5em) 0 0;
    margin-top: -68em;
}
.txt-com.top-message .comment .ttl {
    width: 36%;
    padding: 0;
    margin: 0 auto;
    position: absolute;
    right: 1.3em;
    top: 2em;
    text-align: right;
    font-size: 1.25em;
}
.txt-com.top-message .comment .ttl:before {
    transform: translateX(0);
    width: 100%;
    line-height: 1.1;
    margin-bottom: 0.3em;
    font-size: 2.9em;
}
.txt-com.top-message .comment p {
    width: 73%;
    font-size: var(--p_22size);
}
.txt-com.top-message .comment:before {
    right: auto;
    top: auto;
    left: 3em;
    bottom: -4.7em;
    width: 14.2em;
    background-size: 32em auto;
}


.interview .inner {
    margin: 0 auto 3em;
}
.interview .staff.slide {
    padding-top: 3em;
    padding-bottom: 3rem;
}
.interview .staff .slick-track {
    padding: 2em 0;
}
.interview .top p {
    width: 100%;
    font-size: var(--p_28size);
}
.interview .top h3 {
    font-size: var(--h2_size);
    margin-bottom: 0.2em;
}
.interview:before {
    background-image: url(../img/recruit/int_bg_sp.webp);
}
.interview .top {
    padding: 2em 0 5.6em;
    background-image: url(../img/recruit/int_ttl_bg_sp.webp);
}
.interview .staff .staff_item .catch, .interview .staff .staff_item .position {
    font-size: 2em;
    line-height: 1.2;
}
.interview .staff .staff_item .more {
    font-size: var(--p_28size);
}
.interview .staff .staff_item .position {
    bottom: 2em;
}
.interview .staff .staff_item, .interview .staff .staff_item button {
    border-radius: 3.5em;
}

.interview .staff .swiper-pagination-clickable {
    left: 0;
    right: 0;
    display: block;
}
.interview .staff .swiper-pagination-clickable span {
    border: 2px solid;
    color: var(--color-bg);
    border-radius: 50%;
    width: 1em;
    height: 1em;
    font-size: 1rem;
    min-height: 0;
    padding: 0;
    opacity: 1;
    background: transparent;
    margin: 0 1em;
}
.interview .staff .swiper-pagination-clickable .swiper-pagination-bullet-active {
	background-color: var(--c_white);
}
.rec-movie .inner {
    padding: 0 1em;
}

.descriptions .top .ttl {
    font-size: var(--p_46size);
    margin-bottom: 0.9em;
}
.descriptions .top p {
    font-size: var(--p_22size);
}
.tab_lbl {
    width: calc(var(--col3) + 2.5vw);
    border: 2px solid;
    margin: 0 -2.5vw;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
}
.tab_lbl:before {
    font-size: var(--p_34size);
    line-height: 1.1;
    margin: 0.2em auto;
}
.tab_lbl span {
    font-size: 1.25em;
    padding: 0.2em 0.5em;
    display: block;
    width: fit-content;
    margin: 0 auto;
}
.tab_lbl:nth-of-type(1) {
    transform: translateX(-2.5vw);
    border-left: 0!important;
    padding: 1em 0.5em 1.5em;
}
.tab_lbl:nth-of-type(3) {
    transform: translateX(+2.5vw);
    border-right: 0!important;
}
.tab_con {
    padding: 2em 2em;
    margin: 1em auto;
}
.descriptions .tab_con h4 {
    font-size: var(--p_34size);
}
.descriptions .tab_con h4 + p,.descriptions .tab_con table th,.descriptions .tab_con table td {
    font-size: var(--p_22size);
}
.descriptions .tab_con table th, .descriptions .tab_con table td {
    display: block;
}
.descriptions .tab_con table th {
    padding-bottom: 0;
}
.descriptions .tab_con table td {
    padding: 0 1.5em 1em;
}
.descriptions .target h4 {
    width: 100%;
    text-align: center;
    font-size: var(--p_28size);
    margin-bottom: 1em;
}
.descriptions .target ul {
    width: 95%;
    padding-left: 2em;
    margin: 0 auto;
}
.descriptions .target li {
    font-size: var(--p_22size);
}
.descriptions .entry_btn {
    width: 100%;
}
.descriptions .entry_btn a {
    margin: 0 auto;
    font-size: var(--p_28size);
}
.descriptions .join {
    display: flex;
    flex-wrap: wrap;
    margin: 2em 0 -7.5em;
    padding-bottom: 22em;
}
.descriptions .join p.catch {
    order: 2;
    width: 100%;
    font-size: var(--p_28size);
    margin-bottom: 1em;
}
.descriptions .join p.ft-hd {
    margin: 0 auto 0;
}
.descriptions .join:before {
    bottom: 0;
    background-image: url(../img/recruit/all_member_sp.webp?set260316);
    aspect-ratio: 1/0.47;
}
.flow h3, .qa h3 {
    font-size: var(--p_34size);
    width: 100%;
    text-align: center;
}
.flow .txt-com, .qa .txt-com {
    width: 100%;
}
.flow .txt-com .step .number:before {
    font-size: 1.27em;
}
.flow .txt-com .step .note {
    font-size: 1em;
}
.flow .txt-com .step .sub {
    font-size: 0.9em;
}
.flow .txt-com .step .right a {
    font-size: 0;
}
.flow .txt-com .step .right a:before {
    font-size: var(--fz-jp-note-sp);
}

.qa .qa_item {
    padding: 2em 1em;
}
.accbox label {
    font-size: var(--p_22size);
}
.accbox .accshow {
    font-size: 1.25em;
}
.acc_label:checked + label + .accshow {
    padding: 1em 0 0 3.4em;
}
.qa .note {
    font-size: 1.25em;
    text-align: center;
    margin: 2em auto;
}

.txt-com.staff-message .top .profile .img {
    aspect-ratio: 1/1.8;
    max-height: 71em;
}
.txt-com.staff-message .top .profile .img img {
    object-fit: cover;
    object-position: bottom center;
    width: 100%;
}
.txt-com.staff-message .top .ttl {
    width: 100%;
    max-width: 100%;
    padding: 1.2em 1.7em;
    text-align: left;
    font-size: var(--p_22size);
}
.txt-com.staff-message .top .ttl:before {
    font-size: 3.18em;
    line-height: 1;
}
.txt-com.staff-message .top .ttl:after {
    transform: scale(-1);
}
.txt-com.staff-message .top .profile .en {
    text-align: left;
    bottom: 5em;
    font-size: 2em;
}
.txt-com.staff-message .top .profile .en, .txt-com.staff-message .top .profile .more {
    transform: translateX(0);
    left: 0;
    right: 0;
    margin: 0 auto;
    width: 86%;
}
.txt-com.staff-message .top .profile .more {
    bottom: 1.7em;
    height: calc(100% - 20em);
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
}
.txt-com.staff-message .top .profile .en::before {
    line-height: 0.9;
}
.txt-com.staff-message .top .profile .more .name {
    font-size: 2.3em;
}
.txt-com.staff-message .top .profile .more p {
    font-size: 1.25em;
}
.pop-more .other_btn button:before {
    background-size: 200%;
}
	
.txt-com.staff-message .profile .txt-com {
    font-size: var(--p_22size);
    margin: 2em auto;
}
.interviwe_qa .flex.col2 > * {
    width: var(--col1);
}
.interviwe_qa > .flex {
    margin: 5em auto;
}
.txt-com.staff-message .inner {
    width: 86%;
}
.txt-com.staff-message .inner h5 {
    margin-bottom: 0.5em;
    font-size: 1.2em;
}
.interviwe_qa .txt-com .q {
    font-size: var(--p_28size);
    padding-left: 0.6em;
}
.interviwe_qa .txt-com .q:before {
    font-size: 0.82em;
    margin-bottom: 0.5em;
}
.interviwe_qa .txt-com .q:after {
    width: calc(100% + 7vw);
    right: 0;
    height: 3.8em;
    top: 0.6em;
}
.interviwe_qa .txt-com .a {
    font-size: var(--p_22size);
}
.interviwe_qa .txt-com .a {
    font-size: var(--p_22size);
    width: 100%;
    padding: 0;
}
.interviwe_qa div.img img {
    margin-left: 0;
    margin-top: 5em;
    max-width: 38.75em;
}
.interviwe_qa div.img {
    margin: 3em 0 0;
    padding-bottom: 0;
}
.interviwe_qa div.img:after {
    width: calc(73% + 13vw);
    left: 20%;
    top: 0;
}
.interviwe_qa .col1 .txt-com .q {
    width: 100%;
    padding-right: 8em;
}
.interviwe_qa .txt-com.col3 .a {
    width: 100%;
    order: 2;
    margin-top: 0;
}
.interviwe_qa .txt-com.col3 .a h5 {
    padding-right: 7em;
}

.interviwe_qa .txt-com.col3 {
    position: relative;
}
.interviwe_qa .txt-com.col3 .img {
    width: 17.5em;
    position: absolute;
    right: -7vw;
    top: -10em;
    height: 26em;
}
.interviwe_qa .txt-com.col2 .a {
    width: 100%;
    margin-top: 0;
}
.interview-pop .message dt, .interview-pop .message > .inner:before {
    font-size: 1.25em;
    aspect-ratio: 1 / 0.7;
    margin: -7.3em 0 2em;
}
.interview-pop .message dt {
    padding: 1.1em 1.5em;
}
.interview-pop dl.message {
    margin-top: 11em;
    position: relative;
    z-index: 1;
}
.interview-pop .message dd.txt-com {
    font-size: var(--p_22size);
    width: 90%;
    margin-right: 0;
}
.interview-pop .message dd.img {
    width: 35.5em;
    position: absolute;
    z-index: -1;
    right: -7vw;
    bottom: 0;
    aspect-ratio: auto;
}
.interview-pop .message dd.img img {
    transform: translateX(9em);
    display: block;
}
	
footer .logo {
    width: 12.25em;
}
footer .add, footer .copy, footer .policy {
    font-size: 1.25em;
}
footer .right {
    font-size: var(--p_22size);
}
footer .right .other_link {
    font-size: 1.27em;
    margin: 3em 0 0;
}
footer .right .other_link a {
    margin: 1em 0.2em 1em auto;
}
}


@media (min-width: 751px){
	.pc {
		display: block;
	}
	.sp {
		display: none!important;
	}

.fv .entry_btn {
    font-size: var( --p_17size);
    position: absolute;
    top: 1em;
    right: 7%;
}
.fv .entry_btn a {
    padding: 1em 2.5em;
    padding-right: 5em;
    border: 2px solid var(--c_pink);
    border-top: 0;
    box-sizing: border-box;
    display: block;
}
.fv .entry_btn a:before {
    right: 2em;
}
a.more,button.more:hover, 
.company .company_item a:hover .more,
.company .company_item button:hover .more,
 .interview .staff .staff_item a:hover .more,
 .interview .staff .staff_item button:hover .more {
    transform: scale(1.05);
    background:  var(--c_main);
}
.tab_lbl:hover {
    transform: scale(1.05);
}
.descriptions .entry_btn a:hover {
    background-color: var(--c_main);
    color: var(--color-bg);
    border-color: var(--c_main);
}
.descriptions .entry_btn a:hover::after {
    filter: brightness(0) invert(100%);
    right: 2em;
}
.fv .entry_btn a:hover:before {
    transform: translateY(-50%) scale(1.05);
    right: 1.5em;
}
.flow .txt-com .step .right a:hover:before, footer .entry_btn a:hover:after {
    transform: translateY(-50%) scale(1.05);
    right: -0.5em;
}
}


.rec_form .fv {
    background: var(--c_gr_red-invert);
    padding: 4.2em 0;
    position: relative;
}
.rec_form .fv:before {
    content: '';
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background: url(../img/recruit/entry_bg.webp) var(--bg_center_cover);
    mix-blend-mode: screen;
    opacity: 0.2;
}
.rec_form .fv .logo {
    width: 20em;
    margin: 3em auto;
    filter: brightness(0) invert(100%);
}
.rec_form .fv h1 {
    font-size: var(--p_22size);
    text-align: center;
    color: var(--c_pink);
    font-weight: 500;
    margin-bottom: -8.7em;
}
.rec_form .fv h1:before {
    content: attr(data-title);
    display: block;
    font-size: 6.18em;
    letter-spacing: 0.1em;
    line-height: 1.3;
    opacity: 0.7;
}
.rec_form section.form_com {
    background: var(--c_beige);
    padding: 15em 0;
}
.rec_form section.form_com .inner {
    max-width: 1120px;
	width: var(--w_90size);
	margin: 0 auto;
}
.rec_form section.form_com .inner > p {
	text-align: center;
	font-size: var(--p_17size);
}
.rec_form section.form_com .inner dl {
	max-width: 800px;
	width: var(--w_90size);
	margin: 3em auto 0;
}

.rec_form dt {
    font-size: var(--p_17size);
    margin: 2em 0 1em;
    position: relative;
    width: fit-content;
    padding-right: 4em;
}
.rec_form dt.rec:after {
    content: '必須';
    background: var(--c_pink);
	color: var(--c_white);
    padding: 0 1em;
    font-size: var(--p_14size);
    position: absolute;
    bottom: 0;
    right: 0;
}
input[type="text"], textarea, input[type="url"], input[type="email"], input[type="tel"], input[type="date"], .wpcf7 input[type="file"],.radio label {
    font-size: 1em;
}
input[type="text"], textarea,input[type="url"],input[type="email"],input[type="tel"],input[type="date"] {
    background: var(--color-bg)!important;
    width: 100%;
    padding: 1em;
    box-sizing: border-box;
    border: none!important;
}
input[type="date"] {
    max-width: 10em;
}
input[type="file"]::file-selector-button {
    background-color: var(--c_main);
    color: var(--c_white);
    border: none;
    border-radius: 0.5em;
    padding: 0.2em 1em;
	margin-right: 0.5em;
}
.radio dd .wpcf7-form-control-wrap .wpcf7-radio {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
}
.radio label span.wpcf7-list-item-label {
    padding-left: 2em;
    position: relative;
}
.radio label span.wpcf7-list-item-label:before,.radio label span.wpcf7-list-item-label:after {
    display: block;
    aspect-ratio: 1/1;
    border-radius: 50%;
    position: absolute;
    left: 0.5em;
    top: 50%;
    transform: translateY(-50%);
    box-sizing: border-box;
}
.radio label span.wpcf7-list-item-label:before {
    border: 2px solid;
    width: 1em;
    background: var(--c_white);
}
.radio label span.wpcf7-list-item-label:after {
    width: 0.5em;
    left: calc(0.7em + 1px);
}
.radio label input[type="radio"]:checked + span.wpcf7-list-item-label:after {
    background: var(--c_main);
}
.rec_form .policy.check p {
    text-align: center;
}
.rec_form .policy.check dt,.rec_form .policy.check dd {
    width: 100%;
    font-size: var(--p_22size);
}
.rec_form .check dd .wpcf7-list-item-label:before,.rec_form .check dd .wpcf7-list-item-label:after {
    display: block;
    width: 1em;
    aspect-ratio: 1/1;
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    border-radius: 0.2em;
}
.radio dd .wpcf7-form-control-wrap .wpcf7-radio > * {
    margin: 0 2em 0 0;
}
.rec_form .check dd .wpcf7-list-item-label {
    position: relative;
    padding-left: 1.5em;
}
.rec_form .check dd .wpcf7-list-item-label:before {
    border: 2px solid;
    box-sizing: border-box;
}
.rec_form .check dd .wpcf7-list-item-label:after {
    content: '✓';
    font-family: 'Hind'!important;
    margin: 0.15em 0;
    opacity: 0;
    transition: 0.2s opacity;
}
.rec_form .check dd input[type="checkbox"]:checked + .wpcf7-list-item-label:after {
    opacity: 1;
}
.rec_form dd.submit {
	margin: 1.5em auto;
}
.rec_form dd.submit input[type="submit"]:disabled {
    background: var(--c_main);
}
.rec_form dd.submit input[type="submit"] {
    font-size: var(--p_22size);
    color: var(--c_white);
    background: var(--c_gr_red-invert);
    padding: 0.5em 1.5em;
    border-radius: 0.5em;
    width: 63%;
    letter-spacing: 0.1em;
    transition: 0.2s transform, 0.2s background;
}
.wpcf7-spinner {
	display: none;
}

@media (max-width: 750px){
.rec_form .fv {
    padding: 3.2em 0 4.2em;
}
.rec_form .fv .logo {
    width: 11.625em;
    margin: 0 auto 1em;
}
.rec_form .fv h1 {
    font-size: var(--p_28size);
    letter-spacing: 0.1em;
    margin-bottom: -6.2em;
}
.rec_form .fv h1:before {
    font-size: 3.2em;
    letter-spacing: 0.3em;
}
.rec_form section.form_com {
    padding: 10em 0;
    overflow: hidden;
}
.rec_form section.form_com .inner > p {
    font-size: var(--p_22size);
    text-align: justify;
}
.rec_form section.form_com .inner dl {
    width: 100%;
}
.rec_form dt {
    font-size: var(--p_22size);
    margin: 1em 0;
}
input[type="text"], textarea, input[type="url"], input[type="email"], input[type="tel"], input[type="date"], .wpcf7 input[type="file"],.radio label {
    font-size: clamp(16px, var(--p_22size), 28px);
}
.rec_form .check dd .wpcf7-list-item-label {
    font-size: 0.9em;
}
.radio dd .wpcf7-form-control-wrap .wpcf7-radio > * {
    /* width: calc(100%/3 - 1em); */
    margin: 0 auto 0 0;
}
}


@media (min-width: 751px){
.rec_form dd.submit input[type="submit"]:disabled:hover {
    transform: scale(1);
}
.rec_form dd.submit input[type="submit"]:hover {
    transform: scale(1.05);
}
}


.page_top_btn {
    z-index: 9;
}

.youtube {
    width: 100%;
    aspect-ratio: 16 / 9;
  }
  .youtube iframe {
    width: 100%;
    height: 100%;
  }


.rec_form .wpcf7-turnstile.cf-turnstile {
    margin-inline: auto;
}