@charset "utf-8";

/* ==========================================================================
   RECRUIT 202608 / インテリア販売スタッフを知る
   すべて .rc-know 配下にスコープ（既存 base.css / renewal.css との干渉回避）
   ※ リセットは :where() で詞細度 0 にしているため、下の各コンポーネント
     指定（.rc-xxx）が確実に優先されます。
   ========================================================================== */

div.wrapper_ {
	padding-top: 82px;
}
#breadcrumb {
  background-color: #f5f5f5;
  font-family: neue-haas-grotesk-display,'繝偵Λ繧ｮ繝手ｧ偵ざ Pro W3','Hiragino Kaku Gothic Pro','繝｡繧､繝ｪ繧ｪ',Meiryo,'�ｭ�ｳ �ｰ繧ｴ繧ｷ繝�け',sans-serif;
  padding: 59px 0 26px 89px;
  margin-bottom: 0;
}

#breadcrumb ul {
  font-size: 12px;
  line-height: 1.0;
  font-weight: 400;
  margin-bottom: 38px;
}

#breadcrumb ul li {
  display: inline-block;
  margin-right: 5px;
}

#breadcrumb ul li:after {
  display: inline;
  content: '>';
  margin-left: 5px;
}

#breadcrumb ul li:last-child::after {
  content: '';
}

#breadcrumb ul li a:hover {
  color: #918E80;
  text-decoration: none;
}

#breadcrumb ul li a.current {
  color: #918E80;
}

#breadcrumb h1 {
  font-size: 26px;
  line-height: 1.0;
  font-weight: 600;
  padding-left: 48px;
}
@media screen and (min-width: 768px) {
  #header #globalnav {
    left: auto;
    text-align: right;
    width: 100%;
    top: 50px !important;
    right: 28px !important;
    position: absolute !important;
  }
}

@media screen and (max-width: 767px) {
  #breadcrumb {
    padding: 37px 25px 23px;
    margin-bottom: 30px;
  }
  #breadcrumb ul {
    margin-bottom: 29px;
  }
  #breadcrumb h1 {
    font-size: 22px;
    padding-left: 0;
  }
}

.rc-know {
	--rc-inner: 760px;
	--rc-head: 1024px;
	--rc-text: #111;
	--rc-gray: #b4b4b4;
	--rc-line: #000;
	font-family: "Noto Sans JP", "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", "Yu Gothic", "游ゴシック", Meiryo, sans-serif;
	color: var(--rc-text);
	font-size: 13px;
	line-height: 1.9;
	text-align: left;
	letter-spacing: .02em;
	-webkit-font-smoothing: antialiased;
}

.rc-know :where(*, *:before, *:after) {
	box-sizing: border-box;
}

.rc-know :where(p, ul, ol, li, dl, dt, dd, h2, h3, h4, figure) {
	margin: 0;
	padding: 0;
	list-style: none;
}

.rc-know :where(img) {
	max-width: 100%;
	height: auto;
	vertical-align: bottom;
	border: 0;
}

.rc-know :where(a) {
	color: inherit;
	text-decoration: none;
	transition: all .3s ease;
}

.rc-btn a:hover {
	text-decoration: none;
	background-color: #918E80;
	border-color: #918E80;
}

.rc-inner {
	width: var(--rc-inner);
	max-width: 100%;
	margin: 0 auto;
}

/* ページ内リンクの着地位置。ハッシュ付き URL で直接開いた場合や
   JS 無効時に、固定ヘッダーの下に隠れないよう余白を確保する */
.rc-know [id] {
	scroll-margin-top: 120px;
}

.rc-float {
	position: fixed;
	bottom: 30px;
	right: 30px;
	width: fit-content;
	z-index: 100;
}
.rc-float a {
	display: block;
	color: #000;
	text-decoration: none;
	border: 1px solid #707070;
	background-color: #fff;
	text-align: center;
	font-size: 16px;
	line-height: 1.4;
	font-weight: 700;
	color: #000;
	padding: 17px 21px;
	transition: all 0.5s ease;
}
.rc-float a:hover {
	color: #fff;
	text-decoration: none;
	background-color: #000;
	border: 1px solid #000;
}

/* --------------------------------------------------------------- page head */
.rc-pagehead {
	background: #f4f4f4;
	padding: 59px 0 26px 89px;
}

.rc-pagehead__inner {
	max-width: 100%;
	margin: 0 auto;
}

.rc-breadcrumb {
	font-size: 11px;
	letter-spacing: .08em;
	color: #333;
}

.rc-breadcrumb span {
	margin: 0 .5em;
}

.rc-breadcrumb a:hover {
	color: #918E80;
	text-decoration: none;
}

.rc-breadcrumb a:last-child {
	color: #918E80;
}

.rc-pagehead__ttl {
	margin-top: 26px;
	padding-left: 55px;
	font-size: 26px;
	font-weight: 700;
	line-height: 1.4;
	letter-spacing: .04em;
}

/* -------------------------------------------------------------- key visual */
.rc-kv {
	position: relative;
	overflow: hidden;
	max-width: 1200px;
	margin: 0 auto;
}

.rc-kv img {
	display: block;
	width: 100%;
	height: 610px;
	object-fit: cover;
	object-position: right;
	background: var(--rc-gray);
}

.rc-kv__catch {
	position: absolute;
	top: 11%;
	left: 0;
	width: 100%;
}

.rc-kv__catch p {
	width: var(--rc-head);
	max-width: 100%;
	margin: 0 auto;
	padding-left: 55px;
	color: #000;
	font-size: 30px;
	font-weight: 700;
	line-height: 1.6;
}

/* -------------------------------------------------------------------- lead */
.rc-lead {
	margin-top: 60px;
	text-align: center;
	font-size: 14px;
	line-height: 2.0;
}

/* ---------------------------------------------------------------- headings */
.rc-sec {
	margin-top: 84px;
}

.rc-sec--point {
	margin-top: 100px;
}

.rc-sec--sched {
	margin-top: 84px;
}

.rc-sec--faq {
	margin-top: 100px;
}

.rc-h3 {
	font-size: 22px;
	font-weight: 700;
	line-height: 1.5;
	letter-spacing: .04em;
}

.rc-h3--en {
	font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-size: 27px;
	line-height: 1.0;
}

.rc-h3__sub {
	font-size: 14px;
	font-weight: 700;
}

.rc-h3__lead {
	font-size: 14px;
	font-weight: 700;
}

.rc-note {
	margin-top: 2px;
	font-size: 10px;
	color: #000;
}

/* ------------------------------------------------------------------- point */
.rc-points {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 42px;
	margin-top: 34px;
}

.rc-point__num {
	font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-size: 20px;
	font-weight: 700;
	line-height: 1.5;
	letter-spacing: .01em;
}

.rc-point__ttl {
	margin-top: 6px;
	font-size: 14px;
	font-weight: 700;
	letter-spacing: .02em;
	line-height: 1.5;
}

.rc-point__fig {
	margin-top: 20px;
}

.rc-point__fig img {
	width: 100%;
	height: 200px;
	object-fit: contain;
	object-position: center;
}

.rc-point__txt {
	margin-top: 18px;
	font-size: 14px;
	line-height: 2.0;
}

/* ------------------------------------------------------------------ banner */
.rc-bnr {
	margin-top: 60px;
	text-align: center;
}

/* ----------------------------------------------------------------- numbers */
.rc-nums {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 18px;
	margin-top: 20px;
}

.rc-num {
	display: flex;
	align-items: center;
	min-width: 0;
	min-height: 92px;
	padding: 10px 22px;
	background: var(--rc-gray);
	color: #fff;
}

.rc-num__label {
	flex: 0 0 auto;
	font-size: 14px;
	font-weight: 700;
	line-height: 1.4;
}

.rc-num__val {
	margin-left: auto;
	padding-left: 10px;
	font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-size: 59px;
	font-weight: 700;
	line-height: 1.1;
	white-space: nowrap;
}

.rc-num__val small {
	margin-left: 6px;
	font-size: 15px;
	font-weight: 700;
	letter-spacing: .02em;
}

/* ---------------------------------------------------------------- training */
.rc-flow {
	margin-top: 22px;
}

.rc-flow__item {
	display: flex;
	align-items: center;
	min-height: 143px;
	padding: 14px 20px;
	border: 1px solid var(--rc-line);
}

.rc-flow__term {
	flex: 0 0 235px;
	font-size: 18px;
	font-weight: 700;
	text-align: center;
}

.rc-flow__list {
	flex: 1 1 auto;
}

.rc-flow__list li {
	padding: 4px 0 4px 1em;
	text-indent: -1em;
	font-size: 14px;
	line-height: 1.55;
}

.rc-flow__list li:before {
	content: "・";
}

.rc-flow__arrow {
	width: 0;
	height: 0;
	margin: 6px auto 4px;
	border-left: 8px solid transparent;
	border-right: 8px solid transparent;
	border-top: 11px solid #111;
}

/* --- banner */
.interview-image {
  position: relative;
  width: 350px;
  max-width: 100%;
  height: 135px;
  margin: 0 auto;
}
.interview-image .bg {
  width: 100%;
  height: 100%;
  overflow: hidden;
}
.interview-image .bg img {
  width: 100%;
  opacity: 1;
  -webkit-transition: all 0.3s ease;
  transition: all 0.3s ease;
}
.interview-image .title {
  position: absolute;
  left: 0;
  bottom: 16px;
  width: 196px;
}
.interview-image a:hover .bg img {
  -webkit-transform: scale(1.05);
          transform: scale(1.05);
  opacity: 0.8;
  -webkit-transition: all 0.3s ease;
  transition: all 0.3s ease;
}

/* ---------------------------------------------------------------- schedule */
.rc-sched {
	display: flex;
	align-items: flex-start;
	gap: 50px;
	margin-top: 33px;
}

.rc-sched__list {
	flex: 1 1 auto;
	min-width: 0;
}

.rc-sched__row {
	display: flex;
	align-items: baseline;
	padding-bottom: 48px;
}

.rc-sched__time {
	flex: 0 0 92px;
	font-size: 18px;
	font-weight: 700;
	line-height: 1.5;
}

.rc-sched__txt {
	flex: 1 1 auto;
	min-width: 0;
}

.rc-sched__ttl {
	font-size: 18px;
	font-weight: 700;
	line-height: 1.5;
}

.rc-sched__desc {
	font-size: 14px;
	line-height: 2.0;
}

.rc-sched__photo {
	margin-top: 8px;
}

/* 休憩 */
.rc-sched__row--break {
	display: block;
	padding: 0 0 50px;
}

/* 休憩ボックスの手前だけカンプに合わせて詰める */
.rc-sched__row:has(+ .rc-sched__row--break) {
	padding-bottom: 26px;
}

.rc-sched__break {
	width: 480px;
	max-width: 100%;
	padding: 18px 20px 16px;
	border: 1px solid var(--rc-line);
	text-align: center;
}

.rc-sched__break p {
	margin: 0 !important;
}

.rc-sched__breakttl {
	font-size: 18px;
	font-weight: 700;
	line-height: 1.5;
}

.rc-sched__breaknote {
	font-size: 10px;
	line-height: 1.6;
}

/* 右側の画像カラム（本文の行送りに影響させない） */
.rc-sched__figs {
	flex: 0 0 230px;
}

.rc-sched__figs figure + figure {
	margin-top: 80px;
}

.rc-sched__figs figure:nth-child(3) {
	margin-top: 233px;
}

.rc-sched__figs figure:nth-child(4) {
	margin-top: 50px;
}

.rc-sched__figs img {
	width: 230px;
	height: 138px;
	object-fit: cover;
	background: var(--rc-gray);
}

/* ------------------------------------------------------------------ career */
.rc-career {
	width: 650px;
	max-width: 100%;
	margin: 60px auto 0;
	padding: 40px 30px 30px;
	border: 1px solid var(--rc-line);
	background: #fbfbfb;
}

.rc-career__ttl {
	padding-left: 30px;
	font-size: 22px;
	font-weight: 700;
	line-height: 1.5;
}

.rc-career__ttl span {
	font-size: 18px;
	margin-left: 1.8em;
}

.rc-career__list {
	margin-top: 10px;
	padding-left: 30px;
}

.rc-career__list li {
	padding: 5px 0;
}

.rc-career__list a {
	color: #000;
	font-size: 14px;
	text-decoration: underline;
	text-underline-offset: 1px;
}
.rc-career__list a:hover {
	color: #000;
	opacity: 0.8;
}

/* ----------------------------------------------------------------- buttons */
.rc-btn {
	margin-top: 19px;
	text-align: center;
}

.rc-btn a {
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 200px;
	min-height: 42px;
	padding: 6px 28px;
	background: #000;
	color: #fff;
	font-size: 12px;
	letter-spacing: .06em;
}

.rc-btn a:after {
	content: "";
	position: absolute;
	top: 50%;
	right: 20px;
	width: 0;
	height: 0;
	margin-top: -3px;
	border-top: 3px solid transparent;
	border-bottom: 3px solid transparent;
	border-left: 5px solid #fff;
}

.rc-btn--back {
	margin-top: 100px;
	padding-bottom: 10px;
}

/* --------------------------------------------------------------------- faq */
.rc-faq {
	margin-top: 28px;
}

.rc-faq dt,
.rc-faq dd {
	position: relative;
	padding-left: 40px;
	letter-spacing: .02em;
}

.rc-faq dt:before,
.rc-faq dd:before {
	position: absolute;
	left: 0;
	top: 0;
	font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-size: 22px;
	font-weight: 700;
	line-height: 1.4;
}

.rc-faq dt {
	margin-top: 32px;
	font-size: 14px;
	font-weight: 700;
	line-height: 1.9;
}

.rc-faq dt:before {
	content: "Q.";
}

.rc-faq dd {
	margin-top: 16px;
	font-size: 14px;
	line-height: 2.15;
}

.rc-faq dd:before {
	content: "A.";
}

.pc-none {
	display: none;
}
.sp-none {
	display: block;
}

/* ==========================================================================
   SP
   ========================================================================== */
@media screen and (max-width: 767px) {
	.pc-none {
		display: block;
	}
	.sp-none {
		display: none;
	}
	div.wrapper_ {
		padding-top: 0;
	}

	.rc-inner {
		padding: 0 20px;
	}

	/* page head */
	.rc-pagehead {
		padding: 24px 0 20px;
	}

	.rc-pagehead__inner {
		padding: 0 20px;
	}

	.rc-pagehead__ttl {
		margin-top: 14px;
		padding-left: 0;
		font-size: 20px;
	}

	/* kv */
	.rc-kv img {
		height: 380px;
	}

	.rc-kv__catch {
		top: auto;
		bottom: 8%;
	}

	.rc-kv__catch p {
		padding: 0 20px;
		font-size: 19px;
		color: #fff;
	}

	/* lead */
	.rc-lead {
		margin-top: 40px;
		text-align: left;
	}

	.rc-lead br {
		display: none;
	}

	/* headings */
	.rc-sec,
	.rc-sec--sched,
	.rc-sec--faq {
		margin-top: 60px;
	}

	.rc-sec--point {
		margin-top: 60px;
	}

	.rc-h3 {
		font-size: 19px;
	}

	.rc-h3--en {
		font-size: 22px;
	}

	/* point */
	.rc-points {
		grid-template-columns: 1fr;
		gap: 44px;
		margin-top: 28px;
	}

	.rc-point__fig img {
		height: 200px;
	}

	/* banner */
	.rc-bnr {
		margin-top: 40px;
	}

	/* numbers */
	.rc-nums {
		grid-template-columns: minmax(2, 1fr);
		gap: 12px;
	}

	.rc-num {
		flex-direction: column;
		min-height: 74px;
		padding: 10px 16px;
	}

	.rc-num__label {
		font-size: 12px;
	}

	.rc-num__val {
		font-size: 30px;
		padding: 0;
		margin: 8px auto 0;
	}

	.rc-num__val small {
		margin-left: 4px;
		font-size: 13px;
	}

	/* training */
	.rc-flow__item {
		display: block;
		min-height: 0;
		padding: 20px;
	}

	.rc-flow__term {
		margin-bottom: 10px;
		text-align: left;
	}

	/* schedule */
	.rc-sched {
		display: block;
	}

	.rc-sched__row {
		display: block;
		padding-bottom: 26px;
	}

	.rc-sched__time {
		margin-bottom: 2px;
	}

	.rc-sched__break {
		width: 100%;
	}

	.rc-sched__figs {
		display: grid;
		grid-template-columns: repeat(2, 1fr);
		gap: 12px;
		margin-top: 10px;
	}

	.rc-sched__figs figure + figure,
	.rc-sched__figs figure:nth-child(3),
	.rc-sched__figs figure:nth-child(4) {
		margin-top: 0;
	}

	.rc-sched__figs img {
		width: 100%;
		height: auto;
		aspect-ratio: 230 / 138;
	}

	/* career */
	.rc-career {
		margin-top: 34px;
		padding: 28px 20px 26px;
	}

	.rc-career__ttl {
		padding-left: 0;
		font-size: 17px;
	}

	.rc-career__ttl span {
		display: block;
		margin-left: 0;
	}

	.rc-career__list {
		padding-left: 0;
	}

	/* faq */
	.rc-faq dt,
	.rc-faq dd {
		padding-left: 32px;
	}

	.rc-faq dt:before,
	.rc-faq dd:before {
		font-size: 17px;
	}

	.rc-btn--back {
		margin-top: 64px;
		padding-bottom: 0;
	}
	#footer {
		margin-top: 100px;
	}
}
