:root {
	--base-color: #165CCC;
	--text-color: #fff;
	--text-sub-color: #094AB1;
	/* ====== SP(375-677) =======*/
  --size-58: clamp(3.625rem, 2.064rem + 6.66vw, 7.394rem); /* 58px → 73.9px */
	--size-52: clamp(3.25rem, 1.552rem + 6.93vw, 6.633rem); /* 52px → 106.3px */
  --size-48: clamp(3rem, 1.432rem + 6.4vw, 6.133rem); /* 48px → 98.1px */
  --size-40: clamp(2.5rem, 1.194rem + 5.33vw, 5.111rem); /* 40px → 81.8px */
	--size-38: clamp(2.375rem, 1.133rem + 5.06vw, 4.86rem); /* 38px → 77.7px */
	--size-32: clamp(2rem, 0.955rem + 4.27vw, 4.089rem);        /* 32px → 65.4px */
	--size-24: clamp(1.5rem, 0.716rem + 3.2vw, 3.067rem); /* 24px → 49.1px */
  --size-20: clamp(1.25rem, 0.597rem + 2.67vw, 2.556rem); /* 20px → 40.9px */
  --size-16: clamp(1rem, 0.477rem + 2.13vw, 2.045rem); /* 16px → 32.7px */
  --size-14: clamp(0.875rem, 0.417rem + 1.87vw, 1.789rem); /* 14px → 28.6px */
  --size-12: clamp(0.75rem, 0.358rem + 1.6vw, 1.534rem); /* 12px → 24.5px */
  --size-10: clamp(0.625rem, 0.298rem + 1.33vw, 1.278rem); /* 10px → 20.4px */
  --size-8: clamp(0.5rem, 0.239rem + 1.07vw, 1.023rem); /* 8px → 16.4px */
  --size-4: clamp(0.25rem, 0.119rem + 0.53vw, 0.511rem); /* 4px → 8.2px */
  --size-2: clamp(0.125rem, 0.06rem + 0.27vw, 0.256rem); /* 2px → 4.1px */
	/* ====== PC(678-1280) =======*/
	--size-64-pc: clamp(3.392rem, 0.812rem + 4.28vw, 4rem); /* 54.3px → 64px */
	--size-52-pc: clamp(2.756rem, 0.659rem + 3.48vw, 3.25rem); /* 44.1px → 52px */
	--size-40-pc: clamp(2.12rem, 0.507rem + 2.68vw, 2.5rem); /* 33.9px → 40px */
  --size-32-pc: clamp(1.696rem, 0.406rem + 2.14vw, 2rem); /* 27.1px → 32px */
	--size-28-pc: clamp(1.484rem, 0.355rem + 1.87vw, 1.75rem);/* 23.7px → 28px */
  --size-24-pc: clamp(1.272rem, 0.304rem + 1.61vw, 1.5rem); /* 20.4px → 24px */
	--size-22-pc: clamp(1.166rem, 0.279rem + 1.47vw, 1.375rem);/* 18.7px → 22px */
  --size-20-pc: clamp(1.060rem, 0.254rem + 1.34vw, 1.25rem); /* 17.0px → 20px */
	--size-18-pc: clamp(0.954rem, 0.228rem + 1.20vw, 1.125rem); /* 15.3px → 18px */
  --size-16-pc: clamp(0.848rem, 0.203rem + 1.07vw, 1rem); /* 13.6px → 16px */
  --size-14-pc: clamp(0.742rem, 0.178rem + 0.94vw, 0.875rem);/* 11.9px → 14px */
  --size-12-pc: clamp(0.636rem, 0.152rem + 0.8vw, 0.75rem); /* 10.2px → 12px */
	--size-8-pc: clamp(0.424rem, 0.102rem + 0.53vw, 0.5rem); /* 6.8px → 8px */
	--size-4-pc: clamp(0.212rem, 0.051rem + 0.27vw, 0.25rem); /* 3.4px → 4px */
  --size-2-pc: clamp(0.106rem, 0.025rem + 0.13vw, 0.125rem); /* 1.7px → 2px */
}


html {
	scroll-behavior: smooth;
}

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

body {
	font-family: "Zen Kaku Gothic New", sans-serif;
  font-weight: 400;
  font-style: normal;
	font-size: var(--size-14-pc);
	line-height: 1.7;
	/* color: var(--text-color); */
	background-color: var(--base-color);
	background: url(/img/career/noise.webp) repeat;
	background-size: 160px 160px;
 
}

main {
	overflow: hidden;
}

	.inner {
   width: min(1000px, 92vw);    
   margin: var(--size-52-pc) auto;
		padding: 0;
	}

  .primary-btn {
   border-radius: calc(infinity * 1px);
	 background: linear-gradient(115deg,#0B2041 0%, #1F4F9B 25%, #0B2041 50%, #9FC5FF 75%, #B3D0FF 87.5%, #C8DDFE 100%);
	 background-size: 200% 100%;
	 background-position: 0% 0%;
	 transition: opacity 0.8s ease;
	 box-shadow: 0 0 16px 0 rgba(255, 255, 255, 0.50);
	 line-height: 1.5;
	 font-weight: 700;
	 color: var(--text-color);
	 text-align: center;
	 animation: flicker 7s linear infinite;

		font-size: var(--size-22-pc);
		padding: var(--size-20-pc) var(--size-40-pc);
		max-width: calc(var(--size-20-pc) * 15);
		margin: 0 auto;
	}

	.primary-btn--floating {
    	position: fixed;
	  	right: var(--size-40-pc);
		  left: auto;
	    z-index: calc(infinity);
	    transition: transform 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94), opacity 0.4s ease;
	    opacity: 0;
	    transform: translateY(100px) scale(0.8);
      width: calc(var(--size-40-pc) * 4.5);
		  height: calc(var(--size-40-pc) * 4.5);
		  padding: var(--size-32-pc) 0 0; 
		  display: flex;
	  	justify-content: center;
		  align-items: center;
	  	flex-direction: column;
		  gap: var(--size-8-pc);
		  bottom: var(--size-40-pc);
		  margin: 0;
		  font-size: var(--size-18-pc);
		  letter-spacing: 0.04em;
	}

	.primary-btn--floating::after {
		content: "";
		display: block;
		width: var(--size-32-pc);
		height: var(--size-32-pc);
		background: url(/img/career/icon_double-arrow.svg) no-repeat center center;
		background-size: contain;
	}

  .primary-btn--floating.visible {
	opacity: 1;
  transform: translateY(0) scale(1);
	animation: fadeInUp 0.4s ease-out, flicker 7s linear infinite;
}

  .primary-btn--floating.hidden {
	opacity: 0;
	transform: translateY(100px) scale(0.8);
}

	

.header {
	width: 100%;
	position: absolute;
	top: 0px;
	left: 0px;
	z-index: 20;
	padding: var(--size-12);
} 

	.header {
    width: calc(var(--size-40-pc) * 5);
		max-width: 1280px;
		padding: var(--size-20-pc);
	}

.header__logo {
		width: calc(var(--size-40-pc) * 5);
	}

/* ========== Hero ========== */
.career-hero {
  position: relative;
  width: 100%;
  height: 460px;
  margin: 0 auto;
  background: linear-gradient(
    70deg,
    rgba(119, 167, 242, 0.8) 0%,
    rgba(30, 82, 165, 0.8) 65%,
    rgba(9, 42, 94, 0.8) 100%
  );
  overflow: hidden;
}

.career-hero__bg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  mix-blend-mode: soft-light;
}

.career-hero__bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* 中央タイトル＋両側ライン */
.career-hero__kv {
  position: absolute;
  left: 50%;
  bottom: calc(var(--size-24-pc) * 3); /* タイトル全体の縦位置。必要ならここだけ上下に調整すればOK */
  transform: translateX(-50%);
  display: flex;
  align-items: center; /* テキストと線を縦方向センター揃え */
  gap: var(--size-24-pc);
}

.career-hero__line {
  display: block;
  width: clamp(80px, 12vw, 220px);
  height: var(--size-2-pc);
  background-color: #ffffff;
  opacity: 0.9;
  flex-shrink: 0;
}

/* タイトル部分 */
.career-hero__titles {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--size-16-pc);
}

.career-hero__subtitle,
.career-hero__title {
  font-weight: 500;
  color: #ffffff;
  text-align: center;
}

/* 上の「20代からの挑戦」 */
.career-hero__subtitle {
  margin: 0;
  font-size: var(--size-28-pc);         /* 先にPCサイズだけ固定でOK。後でclampにしても良い */
  letter-spacing: 0.3em;
  line-height: 1.6;
}

/* 下の「新卒キャリア事例」 */
.career-hero__title {
  margin: 0;
  font-size: var(--size-40-pc);
  letter-spacing: 0.35em;
  line-height: 1.4;
}

/* 念のため、このセクション内の文字は横書きに固定 */
.career-hero__titles,
.career-hero__subtitle,
.career-hero__title {
  writing-mode: horizontal-tb;
  text-orientation: mixed;
  white-space: nowrap; /* 一行に収めたいのでPCでは折り返さない */
}



.breadcrumb{ font-size: var(--size-12-pc); margin: 0; color: #AFAFAF; padding-bottom: var(--size-40-pc); padding-top: var(--size-24-pc);}
.breadcrumb ol{ display:flex; gap:.25em; white-space:nowrap; overflow-x:auto; }
.breadcrumb li{ display:inline-flex; align-items:center; }
.breadcrumb li+li::before{ content:"›"; opacity:.6; margin:0 .35em; }
.breadcrumb [aria-current="page"]{ text-decoration: none; opacity: .9; }
.breadcrumb a {
  transition: color .25s ease, text-decoration-color .25s ease;
}
.breadcrumb a:hover {
  color: #094AB1;     
  text-decoration: underline;
  text-underline-offset: 0.2em; 
}

/*  ========== interview  section  ========== */

.smooth {
  clip-path: inset(0 100% 0 0);
  transition: 0.6s cubic-bezier(.49,.11,.53,.84);
  transition-property: clip-path;
}

.smooth.active {
  clip-path: inset(0);
}

.interview {
  background-color: #fff;      
  padding: var(--size-2-pc) 0 var(--size-64-pc) 0;
  position: relative;
  overflow: hidden;            
}

.interview__inner {
  width: min(1000px, 92vw);     
  margin: 0 auto;
  position: relative;
}

/* 背景大字图片 */
.interview__bg {
  position: absolute;
  top: -18px;                  
  right: -40px;
  opacity: 1;                
  pointer-events: none;
  z-index: 0;
  animation: scrollRightToLeft 20s linear infinite;
}

.interview__bg img {
  display: block;
  max-width: none;             
}




/* 标题 */
.interview__header {
  position: relative;
  z-index: 1;
  margin-bottom: var(--size-40-pc);
}

.interview__title {
  font-size: var(--size-40-pc);
	font-weight: 700;
	line-height: 1.3;
	background:linear-gradient(90deg, #0454A2 0%, #9AC5F0 34%);
	background-clip: text;
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	width: fit-content;
	padding-bottom: var(--size-16);
}

/* 卡片网格 */
.interview__grid {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: repeat(5, 1fr); 
  gap:clamp(16px, 2.13vw, 24px);
}

/* 单张卡片 */
.member-card {
  background-color: #fff;
  border: 1px solid #0454A2;
  border-radius: 4px;
  box-shadow: 0 6px 16px rgba(0, 0, 0, 0.08);
  overflow: hidden;
  text-align: center;
  font-size: 14px;
}




.member-card__photo img {
  display: block;
  width: 100%;
  height: auto;
}


.member-card__body {
  padding: var(--size-8-pc) 0 var(--size-8-pc);
}

.member-card__batch {
  font-size: var(--size-14-pc);
  font-weight: 400;
  color: #0050b8;
  margin-bottom: 0px;
  letter-spacing: var(--size-2-pc);
}

.member-card__name {
  font-size: var(--size-20-pc);
  font-weight: 500;
  color: #0050b8;
  letter-spacing: var(--size-2-pc);
}


/* ========== Cross Talk base (PC) ========== */

.crosstalk {
  position: relative;
  padding-top: var(--size-64-pc); 
  color: #fff;
}

.crosstalk__inner {
  width: min(1000px, 92vw);
  margin: 0 auto;
  padding-bottom: var(--size-64-pc);
  position: relative;
}

/*  CROSS / TALK PNG */
.crosstalk__bg-cross {
  position: absolute;
  top: -40px;     
  right: -40px;
  opacity: 1;
  pointer-events: none;
  z-index: 0;
  animation: scrollRightToLeft 20s linear infinite;
}

.crosstalk__bg-talk {
  position: absolute;
  bottom: -40px;    
  left: -40px;
  opacity: 1;
  pointer-events: none;
  z-index: 0;
  animation: scrollLeftToRight 20s linear infinite;
}

.crosstalk__bg img {
  display: block;
  max-width: none;
}


.crosstalk__header {
  position: relative;
  z-index: 1;
  margin-bottom: var(--size-40-pc);
}



.crosstalk__title {
  font-size: var(--size-40-pc);
	font-weight: 700;
	line-height: 1.3;
	background:linear-gradient(90deg, #FFF9E5 0%, #EFD879 22%);
	background-clip: text;
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	width: fit-content;
	padding-bottom: var(--size-2-pc);

}


.crosstalk__list {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  gap: var(--size-32-pc);   
  
  
}

.crosstalk__item {
   overflow: hidden;
   box-shadow: 16px 16px 0px #0000003D;
   border-radius: 8px;
}

.crosstalk__link {
  display: block;
  
}

.crosstalk__link img {
  display: block;
  width: 100%;
  height: auto;

 
}

	/* ========= 行動指針 ======== */

	.credo__list {
		display: grid;
		grid-template-columns: repeat(2, 1fr);
		gap: var(--size-20-pc);
	}

	.credo__item {
		padding: var(--size-12-pc);
		font-size: var(--size-16-pc);
		gap: var(--size-12-pc);
    background: linear-gradient(91deg, #D6E9FF 0%, #BFD7FF 50%, #D6E9FF 100%);
	  padding: var(--size-8);
	  color: var(--text-sub-color);
	  display: flex;
	  align-items: center;
	  font-weight: 700;
	}

	.credo__item::before {
    content: " ";
	  display: inline-block;
		width: var(--size-12-pc);
		height: var(--size-12-pc);
		min-width: var(--size-12-pc);
    background: url(/img/career/icon_check.svg) no-repeat center center;
	 background-size: contain;
	}



	.section-title {
   font-size: var(--size-40-pc);
	 font-weight: 700;
	 line-height: 1.3;
	 background:linear-gradient(90deg, #E1EFFF 51%, #5DA9FF 100%);
	 background-clip: text;
	 -webkit-background-clip: text;
	 -webkit-text-fill-color: transparent;
	 width: fit-content;
	 padding-bottom: var(--size-16);
	}

  .section-title--s {
	font-size: var(--size-18-pc);
}

	.section-title--m {
		font-size: var(--size-40-pc);
	}

	.section-text {
		padding-bottom: var(--size-18-pc);
	}

	.general-list {
    background: linear-gradient(91deg, #D6E9FF 0%, #BFD7FF 50%, #D6E9FF 100%);
	  display: flex;
	  flex-direction: column;
	  gap: var(--size-20);
	  color: var(--text-sub-color);
		padding: var(--size-32-pc);
		gap: var(--size-20-pc);
	}

	.general-list__title {
		font-size: var(--size-20-pc);
		padding-bottom: var(--size-4-pc);
	  font-weight: 700;
	  line-height: 1.3;
	}

	.general-list__text {
		font-size: var(--size-16-pc);
	}


	.reference-btn {
    display: flex;
		font-size: var(--size-24-pc);
		padding-top: var(--size-40-pc);
	  align-items: center;
	  font-weight: 700;
	  line-height: 1.5;
	  transition: all 0.4s ease;
	  width: fit-content;
	}

	.reference-btn--blue {
    padding-top: var(--size-8-pc);
		font-size: var(--size-18-pc);
	}

	.reference-btn--blue::before {
    content: "";
    display: inline-block;
		width: calc(var(--size-24-pc) * 2);
		height: calc(var(--size-24-pc) * 2);
		margin-right: var(--size-8-pc);
	  background: url(/img/career/icon_fili-circle-arrow_blue.svg) no-repeat center center;
	  background-size: contain;
	
	}
	

  .reference-btn--order {
		order: 5;
	}

/* ========= フッター ======== */
.footer {
		padding: calc(var(--size-20-pc) * 3) 0 calc(var(--size-40-pc) * 2);
    border-top: 1px solid #fff;
	  margin-top: var(--size-52);
	}

	.footer__main {
    color: var(--text-color);
		width: min(1000px, 92vw);
		margin: var(--size-52-pc) auto;
		gap: var(--size-32-pc);
    display: flex;
    flex-direction: column;
    line-height: 1.5;
	}

	.footer__logo {
		width: calc(var(--size-20-pc) * 7);
	}

	.footer__links {
		display: flex;
		flex-direction: row;
		gap: var(--size-16-pc);
	}

	.footer__link {
		font-size: var(--size-16-pc);
    font-weight: 700;
	}

	.footer__external-links {
    display: flex;
	  align-items: center;
  	flex-wrap: wrap;
		gap: var(--size-12-pc) var(--size-16-pc);
	}

	.footer__external-link {
		font-size: var(--size-14-pc);
	}

	.footer__external-link::after {
    content: "";
  	background-size: contain;
  	display: inline-block;
		width: var(--size-16-pc);
		height: var(--size-16-pc);
		margin-left: var(--size-4-pc);
	}

	.footer__sns {
    border-radius: 8px;
	  background: rgba(255, 255, 255, 0.8);
    display: flex;
		gap: var(--size-16-pc);
		padding: var(--size-12-pc);
    align-items: center;
    justify-content: flex-start;
	}

  .footer__introduction-link {
		font-size: var(--size-14-pc);
	}
  
	.footer__copyright {
		font-size: var(--size-12-pc);
    opacity: 0.8;
	}

	.attention {
		font-size: var(--size-12-pc);
    opacity: 0.8;
		padding-top: var(--size-40-pc);
	}






@media (min-width: 678px) {
  .interview__scroll {
    display: none;
  }
}


/* ===== Tablet（678px～1024px）===== */
@media (max-width: 1024px) {
  .interview__grid {
    grid-template-columns: repeat(3, 1fr);
  }

  .inner {
    margin: 0 auto;    
    width: min(1000px, 92vw);
  }

.section-title{
    padding-top: var(--size-24);
}


}






/* ========== SP   (～677px) hero  ========== */
@media  (max-width: 677px) {

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


  .career-hero {
    height: 300px;         
  }

  .career-hero__kv {
    top: var(--size-58);        
    gap: var(--size-16);          
    justify-content: center;
  }

  .career-hero__line {
    width: 30px;           
    height: 1px;         
  }

  .career-hero__subtitle {
    font-size: var(--size-16);   
    letter-spacing: 0.2em;      
    line-height: 1.6;
  }

  .career-hero__title {
    font-size: var(--size-24);   
    letter-spacing: 0.25em;
    line-height: 1.4;
  }

  .career-hero__titles,
  .career-hero__subtitle,
  .career-hero__title {
    white-space: nowrap;

  }

  .interview {
    padding: var(--size-2) 0 var(--size-24);
  }

  .interview__bg {
    position: absolute;
    top: -20px;                    
    right: -20px;
    opacity: 1;                 
    pointer-events: none;
    z-index: 0;
    animation: scrollRightToLeft 20s linear infinite;
  }

   .interview__bg img {
    width: 70%;        
    height: auto;      
    margin: 0 auto;    
    display: block;
  }

  .interview__inner {
   width: 100%;
   max-width: 100%;
   margin: var(--size-16) auto 0;
   padding: 0 var(--size-20); 
   box-sizing: border-box;
  }

  .interview__header {
    margin-bottom: var(--size-16);
  }

  .interview__title {
    font-size: var(--size-24);
    line-height: 1.4;
    letter-spacing: 0.12em;
    padding-bottom: var(--size-8);
    width: auto;           
  }

  .interview__viewport {
    width: 80%;             
    max-width: 230px;        
    margin: 0 auto;
    overflow: hidden;        
  }

 
  .interview__grid {
    display: flex;
    overflow-x: auto;
    width: 100%;
    gap: var(--size-58);
    padding-bottom: var(--size-16);
    padding-inline: 0%;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch; 
  }

  .member-card {
    flex: 0 0 100%;    
    max-width: none;  
    scroll-snap-align: center;
  }

  .member-card__batch {
  font-size: var(--size-16);
  font-weight: 400;
  color: #0050b8;
  margin-bottom: 0px;
  letter-spacing: var(--size-2);
    line-height: 1.2em;
}

  .member-card__name {
  font-size: var(--size-32);
  font-weight: 500;
  color: #0050b8;
  letter-spacing: var(--size-2);
  line-height: 1.3em;
  }

 
  .interview__scroll {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    justify-content: flex-end;
    gap: var(--size-4);
    margin-top: var(--size-16);
  }

  .interview__scroll-arrow {
    width: 50%; 
    height: auto;
  }

  .interview__scroll-text {
    font-size: var(--size-12);
    font-weight: 500;
    color: #0454A2;
  }

  /* ========== Cross Talk (SP 375～677px) ========== */


  .crosstalk {
   padding: var(--size-24) 0 var(--size-24);
   overflow: hidden;
  }

  .crosstalk__inner {
    width: 100%;
    margin: 0;
    padding: 0 var(--size-20);
    padding-bottom: var(--size-52);
    box-sizing: border-box;
  }

 

  .crosstalk__bg-cross {
    position: absolute;
    top: -20px;
    right: -20px;
    opacity: 1; 
    pointer-events: none;
    z-index: 0;
    animation: scrollRightToLeft 20s linear infinite;
  }

  .crosstalk__bg-cross img {
    width: 70%;        
    height: auto;      
    margin: 0 auto;    
    display: block;
  }

  .crosstalk__bg-talk {
    position: absolute;
    bottom: -20px;
    left: -20px;
    opacity: 1;
    pointer-events: none;
    z-index: 0;
    animation: scrollLeftToRight 20s linear infinite;
  } 

  .crosstalk__bg-talk img {
    width: 70%;        
    height: auto;      
    margin: 0 auto;    
    display: block;
  }

  .crosstalk__header {
    margin-bottom: var(--size-16);
  }


  .crosstalk__title {
    font-size: var(--size-24);
    line-height: 1.4;
    letter-spacing: 0.12em;
    padding-bottom: var(--size-2);
    width: auto;            
  }

  .crosstalk__list {
    gap: var(--size-16);
  }

.crosstalk__item {

   box-shadow: 8px 8px 0px #0000003D;
   border-radius: 8px;
}



/* --------- 行動指針 -----------*/
.credo__list {
	display: flex;
	flex-direction: column;
	gap: var(--size-8);
}

.credo__item {
	background: linear-gradient(91deg, #D6E9FF 0%, #BFD7FF 50%, #D6E9FF 100%);
	padding: var(--size-8);
	color: var(--text-sub-color);
	display: flex;
	align-items: center;
	gap: var(--size-8);
	font-weight: 700;
}

.credo__item::before {
	content: " ";
	display: inline-block;
	width: var(--size-12);
	height: var(--size-12);
	min-width: var(--size-12);
	background: url(/img/career/icon_check.svg) no-repeat center center;
	background-size: contain;
}

.section-title {
  font-size: var(--size-24);
  line-height: 1.4;
  letter-spacing: 0.12em;
  padding-bottom: var(--size-2);
  padding-top: var(--size-24);
  width: auto;  
	font-weight: 700;
	background:linear-gradient(90deg, #E1EFFF 50%, #5DA9FF 100%);
	background-clip: text;
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	
}

.section-title--m {
	font-size: var(--size-32);
}



.section-text--emphasis {
	font-weight: 700;
}

.reference-btn {
	display: flex;
	align-items: center;
	font-weight: 700;
	line-height: 1.5;
	padding-top: var(--size-16);
	transition: all 0.4s ease;
	width: fit-content;
}



.reference-btn--blue {
	padding-top: var(--size-8);
}

.reference-btn--blue::before {
	content: "";
	display: inline-block;
	width: var(--size-32);
	height: var(--size-32);
	background: url(/img/career/icon_fili-circle-arrow_blue.svg) no-repeat center center;
	background-size: contain;
	margin-right: var(--size-8);
}

.section-text {
	padding-bottom: var(--size-20);
}


.general-list {
	background: linear-gradient(91deg, #D6E9FF 0%, #BFD7FF 50%, #D6E9FF 100%);
	padding: var(--size-20);
  margin-bottom: var(--size-32);
	display: flex;
	flex-direction: column;
	gap: var(--size-20);
	color: var(--text-sub-color);
}

.general-list__title {
	font-size: var(--size-16);
	font-weight: 700;
	padding-bottom: var(--size-4);
	line-height: 1.3;
}


/* --------- フッター --------- */
.footer {
  padding: var(--size-24) var(--size-20);
	border-top: 1px solid #fff;
	margin: 0;
}

.footer__main {
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: var(--size-24);
	line-height: 1.5;
  width: auto;
}

.footer__links {
	display: flex;
	flex-direction: column;
	gap: var(--size-8);
}

.footer__link {
  color: var(--text-color);
  font-weight: 700;
}

.footer__external-links {
  display: flex;
	align-items: center;
	flex-wrap: wrap;
  gap: var(--size-12) var(--size-16);
}

.footer__external-link {
	display: flex;
	align-items: center;
	font-size: var(--size-12);
}

.footer__external-link::after {
	content: "";
	background-size: contain;
	display: inline-block;
	width: var(--size-16);
	height: var(--size-16);
	margin-left: var(--size-4);
}

.footer__sns {
  border-radius: 8px;
	background: rgba(255, 255, 255, 0.8);
  padding: var(--size-8) var(--size-16);
  display: flex;
  gap: var(--size-16);
  align-items: center;
  justify-content: flex-start;
}

.footer__sns img {
  display: block;
}

.footer__introduction-link {
		font-size: var(--size-12);
}


.footer__copyright {
  font-size: var(--size-12);
  opacity: 0.8;
}

.inner {
	max-width: 1280px;
	margin: 0;
  padding: 0 var(--size-20);
  width: auto;
}

.br-pc {
	display: none !important;
}

.primary-btn--floating::after {
  display: none;
}

.primary-btn {
	
	padding: 1em 2em;
	font-size: var(--size-16);
  max-width: none;
	margin: 0 auto;
  width: 100%;
}

.primary-btn--floating {
	position: fixed;
  width: 80%;
  height: auto;
  padding: 0.8em 1.6em;
	bottom: var(--size-12);
	margin: 0;
	z-index: calc(infinity);
	transition: transform 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94), opacity 0.4s ease;
	opacity: 0;
	transform: translateX(-50%) translateY(100px) scale(0.8);
	left: 50%;
  right: auto;
}

.primary-btn--floating.visible {
	opacity: 1;
  
  transform: translateX(-50%) translateY(0) scale(1);
	animation: fadeInUp 0.4s ease-out, flicker 7s linear infinite;
}

.primary-btn--floating.hidden {
	opacity: 0;
  
	transform: translateX(-50%) translateY(100px) scale(0.8);
}

.breadcrumb{
  display: none;

}



}


@media (max-width: 374px) {
  .career-hero__titles,
  .career-hero__subtitle,
  .career-hero__title {
    white-space: nowrap;
  }
  
  .career-hero__subtitle {
    font-size: clamp(12px, calc(16 / 375 * 100vw),16px);
  } 
  .career-hero__title {
    font-size: clamp(20px, calc(24 / 375 * 100vw),24px);
  } 

}

@media (max-width: 300px) {
  .career-hero__titles,
  .career-hero__subtitle,
  .career-hero__title {
    white-space: normal;
  }
  

}

/* --------- ホバーエフェクト --------- */
@media (any-hover: hover) {
	.primary-btn:hover {
		opacity: 0.6;
	}

	.primary-btn--floating:hover {
		opacity: 0.6;
		transform:scale(1.05);
	}

	.cross-talk__combo:hover {
		opacity: 0.6;
	}

	.career-case__thumbnail:hover .career-case__thumbnail-image {
		background: rgba(121, 250, 255, 0.41);
	}

	.reference-btn:hover {
		padding-left: 0.2em;
		opacity: 0.8;
	}

  .member-card:hover{
    opacity: 0.8;

  }

  .crosstalk__item img:hover{
  transition: transform .45s ease;
  will-change: transform;      
  transform-origin: center;
    transform: scale(1.05); 
  }

}

@media (max-width: 677px) and (any-hover: hover){
  .primary-btn--floating:hover{
    transform: translateX(-50%) translateY(0) scale(1.05);
  }
}

/* INTERVIEW 背景文字：右→左ループスクロール */
@keyframes scrollRightToLeft {
  0% {
    transform: translateX(100%);
  }
  100% {
    transform: translateX(-180%);
  }
}

@keyframes scrollLeftToRight {
  0% {
    transform: translateX(-120%);
  }
  100% {
    transform: translateX(220%);
  }
}


