@charset "utf-8";

/* 変数 -----------------------------------------------------------------------------------------*/
:root {
	--image-max: 512px;

	--color-gray: #828282;
	--color-bg: #f1f1f1;
	--color-border: #e6e6e6;
	--color-data: #6795c1;
	--color-num: #999;

	--font-h1: 2.5rem;/*2.8rem;/*3.2rem;*/
	--font-h2: 2.1rem;/*2.4rem;*/
	--font-h3: 2.1rem;/*2.4rem;*/
	--font-h3-l: 3.2rem;/*3.6rem;/*4.0rem;*/
	--font-read: 2.7rem;/*3.0rem;*/

	--font-ll: 2.0rem;
	--font-l: 1.8rem;
	--font-m: 1.6rem;
	--font-s: 1.4rem;
	--font-ss: 1.2rem;
	--font-xs: 1.1rem;

	--line-l: 2.2;
	--line-m: 1.6;
	--line-s: 1.4;


	--th-width: 120px;/*200px;*/
}
/*-----------------------------------------------------------------------------------------------*/


/*-----------------------------------------------------------------------------------------------*/
/* ボディー -------------------------------------------------------------------------------------*/
/*-----------------------------------------------------------------------------------------------*/
.main {
	line-break: strict; /* 禁則処理を厳格に適用 */
	overflow-wrap: anywhere; /* 収まらない場合に折り返す */
	word-break: normal; /* 単語の分割はデフォルトに依存 */

	padding-bottom: var(--margin-150);
}

.main br.pc { display: none; }

.main .h1,
.main .h2,
.main .h3 {
	font-weight: var(--weight-b);
	line-height: var(--line-s);
	/*text-align: justify;*/
}
.main .h1 { font-size: var(--font-h1); }
.main .h2 { font-size: var(--font-h2); }
.main .h3 { font-size: var(--font-h3); }
.main .h3.l {
	font-size: var(--font-h3-l);
	/*letter-spacing: 0.06em;*/
}
.main .hsub {
	font-size: var(--font-s);
	font-weight: var(--weight-b);
	/*letter-spacing: 0.01em;*/
	padding-bottom: var(--margin-5);
	text-align: justify;
}

/* テキスト */
.main .read {
	font-size: var(--font-read);
	line-height: var(--line-m);
	/*letter-spacing: 0.05em;*/
	text-align: justify;
}
.main .comment {
	font-size: var(--font-m);
	line-height: var(--line-l);
	text-align: justify;
}
.main .comment p:not(:first-of-type) { margin-top: 2em; }
.main .comment a { text-decoration: underline; }

/* メインイメージ */
.main .mainimage {
	margin: 0 auto;
	max-width: var(--wrapper-max);
}

/* 見出し */
.main .midashi { margin-top: var(--margin-60); }
.main .midashi .read { margin-top: var(--margin-40); }
.main .midashi .comment { margin-top: var(--margin-20); }

.main .midashi .wrap {
	display: flex;
	flex-direction: column;
	row-gap: var(--margin-20);
}
.main .midashi .wrap .button { text-align: center; }


/* コンテナー */
.main .container { padding-top: calc(var(--header-h) + var(--margin-20)); }
.main .container:not(:first-of-type) { margin-top: var(--margin-100); }

.main .container.line {
	margin-top: var(--margin-100);
	position: relative;
}
.main .container.line::before {
	background-color: var(--color-bg);
	border-radius: 3px;
	content: "";
	height: 5px;
	position: absolute;
	top: 0;
	left: 50%;
	transform: translateX(-50%);
	width: 70px;
}

/* コンテンツ */
.main .contents { margin-top: var(--margin-30); }

/* その他のコンテンツ */
.main .other .button {
	display: flex;
	flex-direction: column;
	row-gap: var(--margin-30);
	margin-top: var(--margin-40);
}
.main .other h2 { font-size: var(--font-h3); }
.main .other .button a {
	padding: var(--button-padding-l);
	width: 100%;
}

/* バナー */
.main .banner {
	display: flex;
	flex-direction: column;
	row-gap: var(--margin-30);
	margin-top: var(--margin-40);
}
.main .button + .banner { margin-top: var(--margin-30); }
.main .banner a {
	border: var(--color-border) solid 1px;
	border-radius: 5px;
	display: flex;
	align-items: center;
	justify-content: center;
	height: 80px;
	width: 100%;
}
.main .banner a img {
	max-width: 290px;
	width: 80%;
}
/*-----------------------------------------------------------------------------------------------*/


/*-----------------------------------------------------------------------------------------------*/
/* MSRとは --------------------------------------------------------------------------------------*/
/*-----------------------------------------------------------------------------------------------*/
#about h3.l + .comment { margin-top: var(--margin-30); }


/* 企業理念 -------------------------------------------------------------------------------------*/
#about .philosophy .contents {
	display: flex;
	flex-direction: column;
	row-gap: var(--margin-60);
}

#about .philosophy .image { text-align: center; }
#about .philosophy .image h4 {
	font-size: var(--font-l);
	font-weight: var(--weight-b);
	padding-bottom: var(--margin-30);
}
#about .philosophy .image img { max-width: var(--image-max); }


/* 事業アウトライン -----------------------------------------------------------------------------*/
#about .outline h3 + .comment { margin-top: var(--margin-10); }

#about .outline .contents { margin-top: var(--margin-80); }

#about .outline h4 span {
	color: var(--color-num);
	font-size: 4.5rem;/*5.0rem;*/
}

#about .outline ul {
	display: flex;
	flex-direction: column;
	align-items: center;
	row-gap: var(--margin-20);
	margin-top: var(--margin-40);
}
#about .outline li {
	border: var(--color-gray) solid 1px;
	border-radius: 5px;
	display: flex;
	align-items: center;
	column-gap: var(--margin-15);
	min-height: 86px;
	padding: 0 var(--margin-15) 0 var(--margin-20);
	width: 100%;
	max-width: 340px;
}
#about .outline .icon { width: 50px; }
#about .outline .text {
	flex: 1;
	font-size: var(--font-m);
	font-weight: var(--weight-b);
	line-height: var(--line-s);
}
#about .outline .text span {
	font-size: var(--font-ss);
	font-weight: var(--weight-m);
}


/* MSR6つの強み ---------------------------------------------------------------------------------*/
#about .strengths .contents,
#about .strengths .item {
	display: flex;
	flex-direction: column;
	row-gap: var(--margin-80);
}
#about .strengths .item {
	align-items: center;
	row-gap: var(--margin-20);
}

#about .strengths .num {
	color: var(--color-num);
	font-size: 9.6rem;
	font-weight: var(--weight-b);
}
#about .strengths h3 { text-align: center; }
#about .strengths .comment { line-height: var(--line-m); }


/* コーポレートサイト関連リンク -----------------------------------------------------------------*/
#about .other.related .button { row-gap: var(--margin-20); }
#about .other.related .button a { padding: var(--button-padding); }


/* MSRを知る：その他のコンテンツ ----------------------------------------------------------------*/
#about .other:last-of-type { margin-top: 0; }
/*-----------------------------------------------------------------------------------------------*/


/*-----------------------------------------------------------------------------------------------*/
/* 採用担当からのメッセージ ---------------------------------------------------------------------*/
/*-----------------------------------------------------------------------------------------------*/
#message .mainimage ul {
	display: flex;
	flex-wrap: wrap;
}
#message .mainimage li {
	aspect-ratio: 1 / 1;
	position: relative;
	width: calc(100% / 4);/*calc(100% / 7);*/
}
#message .mainimage li:nth-child(21),
#message .mainimage li:nth-child(22),
#message .mainimage li:nth-child(23),
#message .mainimage li:nth-child(24),
#message .mainimage li:nth-child(25) { display: none; }
#message .mainimage img {
	position: absolute;
	top: 0;
	left: 0;
}

/* 下が現表示、上が次表示 */
#message .mainimage li .base { opacity: 1; }
#message .mainimage li .overlay {
	opacity: 0;
	transition: opacity 1s ease; /* 1秒クロスフェード */
}
#message .mainimage li.crossfade .overlay { opacity: 1; }

#message .midashi .h1 { margin-top: var(--margin-30); }


/* あるべき人材像 -------------------------------------------------------------------------------*/
.main .talent .item {
	border: var(--color-gray) solid 1px;
	margin-top: var(--margin-40);
	padding: var(--margin-40) var(--margin-20);
}
.main .talent .arrow {
	margin: var(--margin-40) auto;
	width: 57px;
}

.main .talent .item:first-of-type h3 { text-align: center; }

.main .talent ul {
	display: flex;
	flex-direction: column;
	row-gap: var(--margin-20);
	margin-top: var(--margin-30);
}
.main .talent li {
	background-color: var(--color-bg);
	font-size: var(--font-l);
	font-weight: var(--weight-b);
	line-height: var(--line-m);
	padding: var(--margin-20);
	text-align: justify;
}

.main .talent .comment { margin-top: var(--margin-30); }
.main .talent .image {
	margin: var(--margin-50) auto 0;
	max-width: var(--image-max);
}
/*-----------------------------------------------------------------------------------------------*/


/*-----------------------------------------------------------------------------------------------*/
/* データで見る ---------------------------------------------------------------------------------*/
/*-----------------------------------------------------------------------------------------------*/
#data .contents {
	display: flex;
	flex-direction: column;
	row-gap: var(--margin-30);
	margin-top: var(--margin-30);
}

#data .contents .item {
	border: var(--color-gray) solid 1px;
	border-radius: 10px;
	display: flex;
	align-items: center;
	column-gap: var(--margin-30);
	font-weight: var(--weight-b);
	padding: var(--margin-20);
}
#data .contents .icon {
	width: 28%;
	max-width: 120px;/*140px;*/
}
#data .contents .text { flex: 1; }

#data .contents .value {
	display: flex;
	align-items: flex-end;
	column-gap: var(--margin-5);
}
#data .contents .num {
	color: var(--color-data);
	font-size: 5.9rem;/*8.5rem;*/
	white-space: nowrap;
}
#data .contents .unit {
	font-size: 1.8rem;/*2.6rem;*/
	line-height: var(--line-s);
}
#data .contents .unit span { font-size: var(--font-ss); }

/* 育児休暇取得率 */
#data .contents .item.child { flex-direction: column; }
#data .contents .wrap {
	display: flex;
	flex-direction: column;
	row-gap: var(--margin-20);
	margin-top: var(--margin-10);
	width: 100%;
}
#data .contents .wrap > div {
	display: flex;
	align-items: center;
	column-gap: var(--margin-30);
}
#data .contents .wrap .text > p { font-size: var(--font-m); }


/* 社員の数値 -----------------------------------------------------------------------------------*/
/* 男女の割合、学生時代の選考 */
#data .contents .item.half {
	flex-direction: column;
	row-gap: var(--margin-10);
}
#data .contents .item.half .icon {
	width: 100%;
	max-width: 320px;;
}

/* 各職種の割合、年齢層別 */
#data .contents .item.wide {
	flex-direction: column;
	row-gap: var(--margin-10);
	width: 100%;
}
#data .contents .item.wide .icon {
	overflow-x: auto;
	width: 100%;
	max-width: none;
}
#data .contents .item.wide .icon img { min-width: 600px; }
/*-----------------------------------------------------------------------------------------------*/


/*-----------------------------------------------------------------------------------------------*/
/* 仕事を知る -----------------------------------------------------------------------------------*/
/*-----------------------------------------------------------------------------------------------*/
#work .main { padding-bottom: 0; }

#work .base {
	display: flex;
	column-gap: var(--margin-20);/*var(--margin-40);*/
	margin-top: var(--margin-20);
}
#work .base p {
	font-size: var(--font-l);
	font-weight: var(--weight-b);
}
#work .base .tags {
	flex: 1;
	margin-top: 2px;
}

#work .text .h2 { padding-bottom: var(--margin-20); }

#work .gallery ul {
	display: flex;
	flex-direction: column;
	row-gap: var(--margin-40);
}


/* その他の事業を見る ---------------------------------------------------------------------------*/
#work .work {
	background-color: var(--color-bg);
	color: var(--color-gray);
	margin-top: var(--margin-200);
	padding-top: var(--margin-40);
	padding-bottom: var(--margin-60);
}
#work .work .wrapper { max-width: var(--wrapper-max-l); }

#work .work .button {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: var(--margin-20);
	margin-top: var(--margin-20);
}
#work .work .button li {
	width: 100%;
	max-width: 320px;
}
#work .work .button a {
	background-color: var(--color-white);
	color: var(--color-gray);
	transition-property: background-color color;
	width: 100%;
}
#work .work .button a:hover {
	background-color: var(--color-hover);
	color: var(--color-white);
}
/*-----------------------------------------------------------------------------------------------*/


/*-----------------------------------------------------------------------------------------------*/
/* 事業拠点と配属先マップ -----------------------------------------------------------------------*/
/*-----------------------------------------------------------------------------------------------*/
/* 事業拠点 -------------------------------------------------------------------------------------*/
#office .base .midashi { margin-top: 0; }

#office .base .contents {
	display: flex;
	flex-direction: column;
	row-gap: var(--margin-40);
}
#office .base .item {
	background-color: var(--color-bg);
	border-radius: 5px;
	padding: var(--margin-20) var(--margin-15);
}

#office .base h3 {
	font-size: var(--font-l);
	font-weight: var(--weight-b);
}
#office .base .address {
	font-size: var(--font-s);
	line-height: var(--line-s);
	margin-top: var(--margin-20);
}
#office .base .tags { margin-top: var(--margin-20); }


/* 配属先マップ ---------------------------------------------------------------------------------*/
#office .map .comment { margin-top: var(--margin-20); }

#office .map .contents {
	overflow-x: scroll;
	width: 100%;
}
#office .map th,
#office .map td {
	border: var(--color-white) solid 1px;
	font-size: var(--font-m);
	padding: 0 var(--margin-5);
	text-align: center;
	vertical-align: middle;
	width: calc(100% / 6);
	min-width: var(--th-width);
}
#office .map th {
	background-color: #d9d9d9;
	height: 80px;
}
#office .map tbody th {
	background-color: #ebebeb;
	height: 60px;
}
#office .map td {
	background-color: var(--color-bg);
	height: 60px;
}

#office .map a { text-decoration: underline; }
#office .map th span {
	padding-right: 25px;
	position: relative;
}
#office .map th span::after {
	background-color: var(--color-black);
	content: "";
	height: 20px;
	mask-image: url("../images/icon_win.svg");
	mask-repeat: no-repeat;
	mask-size: 20px auto;
	position: absolute;
	top: 1px;
	right: 0;
	width: 20px;
}

#office .map thead th:first-of-type,
#office .map tbody th {
	position: sticky;
	left: 0;
}
#office .map thead th:first-of-type::after,
#office .map tbody th::after {
	border-right: var(--color-white) solid 1px;
	content: "";
	height: 100%;
	position: absolute;
	top: 0;
	right: -1px;
	width: 1px;
}
/*-----------------------------------------------------------------------------------------------*/


/*-----------------------------------------------------------------------------------------------*/
/* 福利厚生 -------------------------------------------------------------------------------------*/
/*-----------------------------------------------------------------------------------------------*/
#welfare .main .item { margin-top: var(--margin-60); }

#welfare .item h3 {
	font-size: var(--font-l);
	font-weight: var(--weight-b);
	line-height: var(--line-s);
	padding-left: 1em;
	text-indent: -1em;
}
#welfare .item h3::before {
	color: var(--color-tag);
	content: "●";
}

#welfare .item h4 {
	font-size: var(--font-m);
	font-weight: var(--weight-b);
	line-height: var(--line-s);
	margin-top: var(--margin-20);
}

#welfare .item .comment { margin-top: var(--margin-15); }
#welfare .item h4 + .comment { margin-top: var(--margin-5); }
#welfare .item .comment ul {
	display: flex;
	flex-direction: column;
	row-gap: var(--margin-5);
}
#welfare .item .comment p + ul { margin-top: var(--margin-15); }
#welfare .item .comment li {
	line-height: var(--line-s);
	padding-left: 1em;
	text-indent: -1em;
}


/* 休暇 -----------------------------------------------------------------------------------------*/
#welfare .vacation {
	display: flex;
	flex-direction: column;
	row-gap: var(--margin-30);
	margin-top: var(--margin-30);
}

#welfare .vacation > div {
	border: var(--color-gray) solid 1px;
	border-radius: 10px;
	display: flex;
	align-items: center;
	column-gap: var(--margin-30);
	font-weight: var(--weight-b);
	padding: var(--margin-20);
}
#welfare .vacation .icon {
	width: 28%;
	max-width: 120px;/*140px;*/
}
#welfare .vacation .text { flex: 1; }

#welfare .vacation .value {
	display: flex;
	align-items: flex-end;
	column-gap: var(--margin-5);
}
#welfare .vacation .num {
	color: var(--color-data);
	font-size: 5.9rem;/*8.5rem;*/
	white-space: nowrap;
}
#welfare .vacation .unit {
	font-size: 1.8rem;/*2.6rem;*/
	line-height: var(--line-s);
}
#welfare .vacation span { font-size: var(--font-ss); }

#welfare .vacation .wrap {
	display: flex;
	flex-direction: column;
	row-gap: var(--margin-20);
}
#welfare .vacation .holyday .wrap { margin-top: var(--margin-10); }
#welfare .vacation .summer .wrap > div > p {
	font-size: var(--font-xs);
	line-height: var(--line-s);
	margin-top: var(--margin-5);
}
#welfare .vacation .holyday .wrap > div > p {
	font-size: var(--font-ss);
	line-height: var(--line-s);
}
#welfare .vacation .holyday br { display: none; }


/* テーブル -------------------------------------------------------------------------------------*/
#welfare .item .table {
	margin: var(--margin-20) auto 0;
	width: 100%;
	max-width: 768px;
}
#welfare .item .table table { width: 100%; }
#welfare .item .table th,
#welfare .item .table td {
	border: var(--color-border) solid 1px;
	padding: 10px var(--margin-10) 12px;
	text-align: center;
}
#welfare .item .table th {
	background-color: var(--color-bg);
	font-size: var(--font-m);
}
#welfare .item .table td { font-size: var(--font-s); }



/* 入寮希望者の負担額 ---------------------------------------------------------------------------*/
#welfare .cost {
	border: var(--color-gray) solid 1px;
	border-radius: 10px;
	margin-top: var(--margin-30);
	padding: var(--margin-20);
}
#welfare .cost h3 { text-align: center; }

/* 負担額 */
#welfare .cost .price {
	font-size: var(--font-ll);
	font-weight: var(--weight-b);
	margin-top: var(--margin-30);
	text-align: center;
}
#welfare .cost .price span {
	color: var(--color-data);
	font-size: 4.9rem;
}
#welfare .cost .price .between { font-size: 2.6rem; }

/* 家賃補給金、寮 */
#welfare .cost .wrap {
	display: flex;
	flex-direction: column;
	row-gap: var(--margin-20);
	margin-top: var(--margin-30);
}
#welfare .cost .wrap > div {
	background-color: var(--color-bg);
	padding: var(--margin-20);
	text-align: center;
}
#welfare .cost h4 { font-size: var(--font-l); }
#welfare .cost .comment { margin-top: var(--margin-10); }
/*-----------------------------------------------------------------------------------------------*/


/*-----------------------------------------------------------------------------------------------*/
/* 教育制度 -------------------------------------------------------------------------------------*/
/*-----------------------------------------------------------------------------------------------*/
#education .container > h3 { margin-top: var(--margin-30); }

#education .contents > .image {
	margin-top: var(--margin-30);
	overflow-x: auto;
}
#education .contents > .image img {
	width: 640px;
	max-width: none;
}


/* 新入社員研修 ---------------------------------------------------------------------------------*/
#education .training .column {
	display: flex;
	flex-direction: column;
	row-gap: var(--margin-20);
}
#education .training .item {
	background-color: var(--color-bg);
	border-radius: 10px;
	padding: var(--margin-40) var(--margin-20);
}
#education .training .item h3 {
	font-size: var(--font-l);
	font-weight: var(--weight-b);
	line-height: var(--line-s);
	text-align: center;
}
#education .training .item .icon {
	margin: var(--margin-10) auto;
	max-width: 120px;/*140px;*/
}
#education .training .item .comment { line-height: var(--line-m); }
/*-----------------------------------------------------------------------------------------------*/


/*-----------------------------------------------------------------------------------------------*/
/* 人を知る -------------------------------------------------------------------------------------*/
/*-----------------------------------------------------------------------------------------------*/
#person .midashi .name {
	display: flex;
	flex-wrap: wrap;
	row-gap: var(--margin-5);
	font-size: var(--font-m);
	font-weight: var(--weight-b);
	margin-top: var(--margin-30);
}
#person .midashi .name p::after { content: "｜"; }
#person .midashi .group {
	display: flex;
	flex-wrap: wrap;
	gap: var(--margin-5) var(--margin-20);
	font-size: var(--font-m);
	margin-top: var(--margin-10);
}
#person .midashi .tags { margin-top: var(--margin-20); }

#person .container {
	display: flex;
	flex-direction: column;
	row-gap: var(--margin-150);
}

#person .contents {
	display: flex;
	flex-direction: column;
	row-gap: var(--margin-30);
}

#person .contents .text {
	margin: 0 auto;
	width: var(--wrapper);
	max-width: var(--wrapper-max);
}
#person .contents .q {
	display: flex;
	font-size: var(--font-l);
	font-weight: var(--weight-b);
	line-height: var(--line-m);
}
#person .contents .q span:first-of-type { width: 1.5em; }
#person .contents .q span:last-of-type { flex: 1; }
#person .contents .comment { margin-top: var(--margin-10); }
/*-----------------------------------------------------------------------------------------------*/


/*-----------------------------------------------------------------------------------------------*/
/* よくある質問 ---------------------------------------------------------------------------------*/
/*-----------------------------------------------------------------------------------------------*/
#top #faqlist .button,
#top #recruitlist .button,
#faq .main .button {
	display: flex;
	flex-direction: column;
	row-gap: var(--margin-10);
}
#top #faqlist .button a,
#top #recruitlist .button a,
#faq .main .button a { width: 100%; }

#faq .main .button { margin-top: var(--margin-60); }

#faq .contents,
#faq .contents dl {
	display: flex;
	flex-direction: column;
}

#faq .contents dl {
	font-size: var(--font-m);
	row-gap: var(--margin-20);
	line-height: var(--line-m);
}
#faq .contents dt,
#faq .contents .qa {
	font-size: var(--font-l);
	font-weight: var(--weight-b);
}

#faq .contents dt,
#faq .contents dd > div { display: flex; }
#faq .contents .qa { width: 1.5em; }
#faq .contents .text { flex: 1; }

#faq .contents dt {
	cursor: pointer;
	padding-left: 30px;
	position: relative;
	transition: color 0.2s ease-out;
	user-select: none;
}
#faq .contents dt::before {
	border-right: var(--color-button) solid 2px;
	border-bottom: var(--color-button) solid 2px;
	content: "";
	height: 12px;
	position: absolute;
	top: 9px;
	left: 0;
	transform: rotate(-45deg);
	transition: 0.2s ease-out;
	transition-property: border-color transform;
	width: 12px;
}
#faq .contents .active dt::before {
	top: 6px;
	transform: rotate(45deg);
}
/* hover */
#faq .contents dt:hover { color: var(--color-hover); }
#faq .contents dt:hover::before { border-color: var(--color-hover); }

#faq .contents dd {
	max-height: 0;
	overflow: hidden;
	padding-left: 30px;
	transition: max-height 0.2s ease-out;
}
#faq .contents dl:not(:last-of-type) dd > div { padding-bottom: var(--margin-60); }
/*-----------------------------------------------------------------------------------------------*/


/*-----------------------------------------------------------------------------------------------*/
/* 募集要項 -------------------------------------------------------------------------------------*/
/*-----------------------------------------------------------------------------------------------*/
#recruit .contents ul > li,
#recruit .main .notes {
	padding-left: 1em;
	text-indent: -1em;
}
#recruit .contents ul > li::before { content: "・"; }
#recruit .main .notes { display: inline-block; }

#recruit .table > dl > dt {
	background-color: var(--color-bg);
	border: var(--color-border) solid 1px;
	font-size: var(--font-l);
	font-weight: var(--weight-b);
	line-height: var(--line-m);
	padding: 10px 0 11px;
	text-align: center;
}

#recruit .table > dl > dd {
	font-size: var(--font-m);
	line-height: var(--line-m);
	padding: var(--margin-20) 0 var(--margin-40);
}

#recruit .table ul,
#recruit .table ol {
	display: flex;
	flex-direction: column;
	row-gap: var(--margin-5);
}
#recruit .table ol { row-gap: var(--margin-30); }
#recruit .table ul.office { row-gap: var(--margin-20); }
#recruit .table ol > li:not(:first-child) {
	border-top: var(--color-border) solid 1px;
	padding-top: var(--margin-30);
}

#recruit .salary { display: table; }
#recruit .salary dl { display: table-row; }
#recruit .salary dt,
#recruit .salary dd { display: table-cell; }
#recruit .salary dt { white-space: nowrap; }
#recruit .salary dd {
	text-align: right;
	padding-left: var(--margin-20);
}

#recruit .table * + p { margin-top: var(--margin-20); }


/* 募集方法 -------------------------------------------------------------------------------------*/
#recruit .entry h2 + .comment { margin-top: var(--margin-10); }
#recruit .entry h3 {
	font-size: var(--font-l);
	font-weight: var(--weight-b);
}

#recruit .entry .contents,
#recruit .entry .box {
	border: var(--color-gray) solid 1px;
	display: flex;
	flex-direction: column;
	row-gap: var(--margin-20);
	padding: var(--margin-20);
}
#recruit .entry .box {
	display: inline-block;
	margin-top: var(--margin-20);
}

#recruit .entry .item {
	background-color: var(--color-bg);
	font-size: var(--font-m);
	line-height: var(--line-m);
	padding: var(--margin-20);
}


/* 選考フロー -----------------------------------------------------------------------------------*/
#recruit .flow .tag {
	background-color: var(--color-gray);
	margin-top: 2px;
	margin-left: var(--margin-10);
	padding-right: 7px;
	padding-left: 7px;
}
#recruit .flow .fukidashi .tag { margin-top: 6px; }
#recruit .flow h3,
#recruit .flow dd p:not(.notes) {
	display: flex;
	align-items: flex-start;
}

#recruit .flow .fukidashi {
	border: var(--color-gray) solid 1px;
	margin-bottom: var(--margin-50);
	padding: var(--margin-20);
	position: relative;
}
#recruit .flow .fukidashi::after {
	background-image: url("../images/fukidashi.svg");
	background-size: 42px auto;
	content: "";
	height: 28px;
	position: absolute;
	bottom: -27px;
	left: 50%;
	transform: translateX(-50%);
	width: 42px;
}
#recruit .flow .comment {
	line-height: var(--line-m);
	margin-top: var(--margin-10);
}

#recruit .flow .wrap,
#recruit .flow .wrap > div {
	display: flex;
	flex-direction: column;
	row-gap: var(--margin-50);
}

#recruit .flow dl {
	background-color: var(--color-bg);
	display: flex;
	flex-direction: column;
	font-size: var(--font-l);
	font-weight: var(--weight-b);
	padding: var(--margin-20);
}

#recruit .flow dt {
	font-size: var(--font-ll);
	font-weight: var(--weight-b);
	padding-bottom: var(--margin-20);
}

#recruit .flow dd {
	border-top: var(--color-gray) solid 1px;
	padding-top: var(--margin-20);
	position: relative;
}
#recruit .flow dd .notes {
	font-size: var(--font-ss);
	font-weight: var(--weight-m);
	line-height: var(--line-m);
	margin-top: var(--margin-10);
}
#recruit .flow dd::after {
	background-image: url("../images/arrow.svg");
	background-size: 35px auto;
	content: "";
	height: 18px;
	position: absolute;
	bottom: -54px;
	left: 50%;
	transform: translateX(-50%);
	width: 35px;
}
#recruit .flow .wrap > div:last-of-type dl:last-of-type dd::after { content: none; }
/*-----------------------------------------------------------------------------------------------*/


/*-----------------------------------------------------------------------------------------------*/
/* トップ ---------------------------------------------------------------------------------------*/
/*-----------------------------------------------------------------------------------------------*/
#top .mainimage,
#top .wrapper { max-width: var(--wrapper-max-l); }

#top .pan { display: none; }

#top .contents { margin-top: var(--margin-30); }
#top .contents h3 {
	font-size: var(--font-l);
	font-weight: var(--weight-b);
	line-height: var(--line-s);
	margin-top: var(--margin-15);
}
#top .contents .comment {
	line-height: var(--line-m);
	margin-top: var(--margin-15);
}
#top .contents h3 + .tags { margin-top: var(--margin-15); }
#top .contents .comment + .tags { margin-top: var(--margin-15); }

/* リスト */
#top .contents.list {
	display: flex;
	flex-direction: column;
	row-gap: var(--margin-40);
}
#top .contents.list > li {
	border: var(--color-border) solid 1px;
	border-radius: 5px;
}
#top .list > li > a {
	display: block;
	height: 100%;
	padding: var(--margin-20);
}

/* グリッド */
#top .contents.grid {
	display: flex;
	flex-direction: column;
	row-gap: var(--margin-40);
}
#top .grid > li:first-child .image {
	overflow: hidden;
	position: relative;
}
#top .grid > li:first-child .image img {
	height: 100%;
	object-fit: cover;
	width: auto;
}
#top #msrlist li:first-child .image { aspect-ratio: 840 / 360; }
#top #environmentlist li:first-child .image { aspect-ratio: 840 / 510; }

/* VIEW MORE */
#top .view {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-top: var(--margin-10);
	padding-right: 80px;
}
#top .view > div {
	background-color: transparent;
	border: var(--color-black) solid 1px;
	border-radius: 50%;
	height: 34px;
	position: relative;
	transition: background-color 0.2s ease-out;
	width: 34px;
}
#top .view > div::before {
	background-color: var(--color-black);
	content: "";
	height: 11px;
	mask-image: url("../images/icon_view_arrow.svg");
	mask-repeat: no-repeat;
	mask-size: 11px auto;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	transition: background-color 0.2s ease-out;
	width: 11px;
}
#top .view > div::after {
	background-color: var(--color-black);
	content: "";
	height: 11px;
	mask-image: url("../images/icon_view_text.svg");
	mask-repeat: no-repeat;
	mask-size: 71px auto;
	position: absolute;
	top: 50%;
	left: 40px;
	transform: translateY(-50%);
	transition: background-color 0.2s ease-out;
	width: 71px;
}
#top a:hover .view > div { background-color: var(--color-hover); }
#top a:hover .view > div::before { background-color: var(--color-white); }
#top a:hover .view > div::after { background-color: var(--color-hover); }

#top .view h3 { margin-top: 0; }
#top .view + .comment { margin-top: var(--margin-10); }


/* MOVIE ----------------------------------------------------------------------------------------*/
#top .mainimage {
	opacity: 0;
	transition: opacity 0.8s ease-out;
}
#top .mainimage.active { opacity: 1; }
#top .mainimage video { width: 100%; }


/* お知らせ -------------------------------------------------------------------------------------*/
#top #newslist .wrap { overflow: hidden; }
#top #newslist .date {
	float: left;
	font-size: var(--font-m);
	margin-top: var(--margin-15);
	padding-right: var(--margin-15);
}
#top #newslist .tags {
	float: right;
	margin-top: var(--margin-15);
}


/* 人を知る -------------------------------------------------------------------------------------*/
#top #personlist h2 + .comment { margin-top: var(--margin-30); }
#top #personlist .list .comment { font-size: var(--font-s); }
/*-----------------------------------------------------------------------------------------------*/





@media(min-width: 530px) {
}



@media(min-width: 768px) {
	/*-----------------------------------------------------------------------------------------------*/
	/* ボディー -------------------------------------------------------------------------------------*/
	/*-----------------------------------------------------------------------------------------------*/
	.main br.sp { display: none; }
	.main br.pc { display: inline; }
	/* 見出し */
	.main .midashi .wrap {
		flex-direction: row;
		align-items: center;
		justify-content: space-between;
	}
	/* その他のコンテンツ */
	.main .other .button {
		flex-direction: row;
		column-gap: var(--margin-40);
	}
	.main .other .button p { width: calc((100% - var(--margin-40)) / 2); }
	/* バナー */
	.main .banner {
		flex-direction: row;
		column-gap: var(--margin-20);/*var(--margin-40);*/
	}
	.main .banner p { width: calc((100% - (var(--margin-20)) * 2) / 3); }
	/*-----------------------------------------------------------------------------------------------*/

	/*-----------------------------------------------------------------------------------------------*/
	/* MSRとは --------------------------------------------------------------------------------------*/
	/*-----------------------------------------------------------------------------------------------*/
	/* 事業アウトライン -----------------------------------------------------------------------------*/
	#about .outline ul {
		flex-direction: row;
		flex-wrap: wrap;
		align-items: normal;
		justify-content: center;
		column-gap: var(--margin-20);
	}
	#about .outline li { width: calc((100% - var(--margin-20)) / 2); }
	/* MSR6つの強み ---------------------------------------------------------------------------------*/
	#about .strengths .contents {
		flex-direction: row;
		flex-wrap: wrap;
		column-gap: var(--margin-60);
	}
	#about .strengths .contents .item { width: calc((100% - var(--margin-60)) / 2); }
	/* コーポレートサイト関連リンク -----------------------------------------------------------------*/
	#about .other.related .button {
		flex-wrap: wrap;
		justify-content: center;
	}
	/*-----------------------------------------------------------------------------------------------*/

	/*-----------------------------------------------------------------------------------------------*/
	/* 採用担当からのメッセージ ---------------------------------------------------------------------*/
	/*-----------------------------------------------------------------------------------------------*/
	#message .mainimage li { width: calc(100% / 5); }
	/* あるべき人材像 -------------------------------------------------------------------------------*/
	.main .talent h3 { text-align: center; }
	.main .talent ul {
		flex-direction: row;
		flex-wrap: wrap;
		column-gap: var(--margin-20);
	}
	.main .talent li { width: calc((100% - var(--margin-20)) / 2); }
	/*-----------------------------------------------------------------------------------------------*/

	/*-----------------------------------------------------------------------------------------------*/
	/* データで見る ---------------------------------------------------------------------------------*/
	/*-----------------------------------------------------------------------------------------------*/
	#data .contents {
		flex-direction: row;
		flex-wrap: wrap;
		column-gap: var(--margin-20);
	}
	#data .contents .item { width: calc((100% - var(--margin-20)) / 2); }
	#data .contents .item .icon { width: 80px; }
	/* 育児休暇取得率 */
	#data .contents .item.child { width: 100%; }
	#data .contents .wrap {
		flex-direction: row;
		justify-content: center;
		column-gap: var(--margin-40);
		/*width: auto;*/
	}
	/*#data .contents .wrap > div { width: calc((100% - (var(--margin-20) * 3) ) / 2); }*/
	/*-----------------------------------------------------------------------------------------------*/

	/*-----------------------------------------------------------------------------------------------*/
	/* 仕事を知る -----------------------------------------------------------------------------------*/
	/*-----------------------------------------------------------------------------------------------*/
	#work .base { column-gap: var(--margin-40); }
	#work .gallery ul {
		flex-direction: row;
		column-gap: var(--margin-20);
	}
	/* その他の事業を見る ---------------------------------------------------------------------------*/
	#work .work .button li { width: calc((100% - var(--margin-20)) / 2); }
	/*-----------------------------------------------------------------------------------------------*/

	/*-----------------------------------------------------------------------------------------------*/
	/* 事業拠点と配属先マップ -----------------------------------------------------------------------*/
	/*-----------------------------------------------------------------------------------------------*/
	/* 事業拠点 -------------------------------------------------------------------------------------*/
	#office .base .contents {
		flex-direction: row;
		flex-wrap: wrap;
		column-gap: var(--margin-30);
	}
	#office .base .item { width: calc((100% - var(--margin-30)) / 2); }
	/*-----------------------------------------------------------------------------------------------*/

	/*-----------------------------------------------------------------------------------------------*/
	/* 福利厚生 -------------------------------------------------------------------------------------*/
	/*-----------------------------------------------------------------------------------------------*/
	/* 休暇 -----------------------------------------------------------------------------------------*/
	#welfare .vacation {
		flex-direction: row;
		flex-wrap: wrap;
		column-gap: var(--margin-20);
	}
	#welfare .vacation > div { width: calc((100% - var(--margin-20)) / 2); }
	/* 入寮希望者の負担額 ---------------------------------------------------------------------------*/
	/* 負担額 */
	#welfare .cost .price {
		display: flex;
		align-items: center;
		justify-content: center;
		column-gap: var(--margin-10);
	}
	/* 家賃補給金、寮 */
	#welfare .cost .wrap {
		flex-direction: row;
		column-gap: var(--margin-20);
	}
	#welfare .cost .wrap > div { width: calc((100% - var(--margin-20)) / 2); }
	/*-----------------------------------------------------------------------------------------------*/

	/*-----------------------------------------------------------------------------------------------*/
	/* 教育制度 -------------------------------------------------------------------------------------*/
	/*-----------------------------------------------------------------------------------------------*/
	#education .contents > .image img {
		width: auto;
		max-width: 100%;
	}
	/* 新入社員研修 ---------------------------------------------------------------------------------*/
	#education .training .column {
		flex-direction: row;
		flex-wrap: wrap;
		column-gap: var(--margin-20);
	}
	#education .training .item { width: calc((100% - var(--margin-20)) / 2); }
	#education .training .item:last-of-type { width: 100%; }
	/*-----------------------------------------------------------------------------------------------*/

	/*-----------------------------------------------------------------------------------------------*/
	/* 人を知る -------------------------------------------------------------------------------------*/
	/*-----------------------------------------------------------------------------------------------*/
	#person .contents {
		flex-direction: row;
		/*align-items: center;*/
		column-gap: var(--margin-30);
		margin: 0 auto;
		width: var(--wrapper);
		max-width: var(--wrapper-max);
	}
	#person .contents:nth-child(odd) { flex-direction: row-reverse; }
	#person .contents .text {
		flex: 1;
		width: auto;
		max-width: none;
	}
	#person .contents .image { width: 42%; }
	/*-----------------------------------------------------------------------------------------------*/

	/*-----------------------------------------------------------------------------------------------*/
	/* よくある質問 ---------------------------------------------------------------------------------*/
	/*-----------------------------------------------------------------------------------------------*/
	#top #faqlist .button,
	#top #recruitlist .button,
	#faq .main .button {
		flex-direction: row;
		flex-wrap: wrap;
		gap: var(--margin-20);
	}
	#top #faqlist .button p,
	#top #recruitlist .button p,
	#faq .main .button p { width: calc((100% - var(--margin-20)) / 2); }
	#top #faqlist .button a,
	#top #recruitlist .button a,
	#faq .main .button a { padding: var(--button-padding-l); }
	/*-----------------------------------------------------------------------------------------------*/

	/*-----------------------------------------------------------------------------------------------*/
	/* 募集要項 -------------------------------------------------------------------------------------*/
	/*-----------------------------------------------------------------------------------------------*/
	#recruit .table {
		border-bottom: var(--color-border) solid 1px;
		display: table;
		width: 100%;
	}
	#recruit .table > dl { display: table-row; }
	#recruit .table > dl > dt,
	#recruit .table > dl > dd {
		display: table-cell;
		padding: var(--margin-15);
		vertical-align: middle;
	}
	#recruit .table > dl > dt {
		border-bottom: none;
		white-space: nowrap;
	}
	#recruit .table > dl > dd {
		border-top: var(--color-border) solid 1px;
		border-right: var(--color-border) solid 1px;
	}
	#recruit .table .type {
		padding-right: 0;
		padding-left: 0;
	}
	#recruit .table .type > ol > li {
		padding-right: var(--margin-15);
		padding-left: var(--margin-15);
	}
	/* 選考フロー -----------------------------------------------------------------------------------*/
	#recruit .flow .wrap {
		flex-direction: row;
		column-gap: var(--margin-50);
	}
	#recruit .flow .wrap  > div { width: calc((100% - var(--margin-50)) / 2); }
	#recruit .flow .wrap dl:last-of-type dd::after { content: none; }
	/*-----------------------------------------------------------------------------------------------*/

	/*-----------------------------------------------------------------------------------------------*/
	/* トップ ---------------------------------------------------------------------------------------*/
	/*-----------------------------------------------------------------------------------------------*/
	/* リスト */
	#top .contents.list {
		flex-direction: row;
		flex-wrap: wrap;
		column-gap: var(--margin-20);
	}
	#top .contents.list > li { width: calc((100% - var(--margin-20)) / 2); }
	/* グリッド */
	#top .contents.grid {
		flex-direction: row;
		flex-wrap: wrap;
		gap: var(--margin-80) var(--margin-40);
	}
	#top .grid > li { width: calc((100% - var(--margin-40)) / 2); }
	#top .grid > li:first-child { width: 100%; }
	#top .grid > li:first-child .image { aspect-ratio: auto !important; }
	#top .grid > li:first-child .image img {
		height: auto;
		width: 100%;
	}
	/* MOVIE ----------------------------------------------------------------------------------------*/
	#top .mainimage .catch {
		font-size: 2.4rem;
		letter-spacing: 0.2em;
		bottom: 20%;
	}
	/*-----------------------------------------------------------------------------------------------*/
}



@media(min-width: 1024px) {
	/*-----------------------------------------------------------------------------------------------*/
	/* ボディー -------------------------------------------------------------------------------------*/
	/*-----------------------------------------------------------------------------------------------*/
	/* メインイメージ */
	.main .mainimage { padding-top: var(--margin-60); }
	/*-----------------------------------------------------------------------------------------------*/

	/*-----------------------------------------------------------------------------------------------*/
	/* MSRとは --------------------------------------------------------------------------------------*/
	/*-----------------------------------------------------------------------------------------------*/
	/* 企業理念 -------------------------------------------------------------------------------------*/
	#about .philosophy .contents {
		flex-direction: row;
		column-gap: var(--margin-30);
	}
	#about .philosophy .text { flex: 1; }
	#about .philosophy .image { width: 45%; }
	/* コーポレートサイト関連リンク -----------------------------------------------------------------*/
	#about .other.related .button p { width: calc((100% - (var(--margin-40)) * 2) / 3); }
	/*-----------------------------------------------------------------------------------------------*/

	/*-----------------------------------------------------------------------------------------------*/
	/* 採用担当からのメッセージ ---------------------------------------------------------------------*/
	/*-----------------------------------------------------------------------------------------------*/
	#message .mainimage li { width: calc(100% / 7); }
	#message .mainimage li:nth-child(21) { display: block; }
	/* あるべき人材像 -------------------------------------------------------------------------------*/
	.main .talent li { padding: var(--margin-30); }
	/*-----------------------------------------------------------------------------------------------*/

	/*-----------------------------------------------------------------------------------------------*/
	/* データで見る ---------------------------------------------------------------------------------*/
	/*-----------------------------------------------------------------------------------------------*/
	#data .contents .item .icon { width: 120px; }
	/* 育児休暇取得率 */
	#data .contents .wrap { column-gap: var(--margin-80); }
	/*-----------------------------------------------------------------------------------------------*/

	/*-----------------------------------------------------------------------------------------------*/
	/* 仕事を知る -----------------------------------------------------------------------------------*/
	/*-----------------------------------------------------------------------------------------------*/
	#work .gallery ul { column-gap: var(--margin-40); }
	/*-----------------------------------------------------------------------------------------------*/

	/*-----------------------------------------------------------------------------------------------*/
	/* 事業拠点と配属先マップ -----------------------------------------------------------------------*/
	/*-----------------------------------------------------------------------------------------------*/
	/* 事業拠点 -------------------------------------------------------------------------------------*/
	#office .base .item { width: calc((100% - (var(--margin-30) * 2)) / 3); }
	/*-----------------------------------------------------------------------------------------------*/

	/*-----------------------------------------------------------------------------------------------*/
	/* 福利厚生 -------------------------------------------------------------------------------------*/
	/*-----------------------------------------------------------------------------------------------*/
	/* 休暇 -----------------------------------------------------------------------------------------*/
	#welfare .vacation { gap: var(--margin-20); }
	#welfare .vacation > div { width: calc((100% - var(--margin-20)) / 2); }
	#welfare .vacation .wrap {
		flex-direction: row;
		column-gap: var(--margin-20);
	}
	#welfare .vacation .summer br { display: none; }
	#welfare .vacation .holyday br { display: inline; }
	/* 入寮希望者の負担額 ---------------------------------------------------------------------------*/
	#welfare .cost { padding: var(--margin-30); }
	/* 負担額 */
	#welfare .cost .price { column-gap: var(--margin-20); }
	/* 家賃補給金、寮 */
	#welfare .cost .wrap {
		column-gap: var(--margin-40);
		margin-top: var(--margin-40);
	}
	#welfare .cost .wrap > div { width: calc((100% - var(--margin-40)) / 2); }
	/*-----------------------------------------------------------------------------------------------*/

	/*-----------------------------------------------------------------------------------------------*/
	/* 教育制度 -------------------------------------------------------------------------------------*/
	/*-----------------------------------------------------------------------------------------------*/
	/* 新入社員研修 ---------------------------------------------------------------------------------*/
	#education .training .item { width: calc((100% - (var(--margin-20) * 2)) / 3) !important; }
	#education .training .item h3 { height: 3em; }
	/*-----------------------------------------------------------------------------------------------*/

	/*-----------------------------------------------------------------------------------------------*/
	/* 人を知る -------------------------------------------------------------------------------------*/
	/*-----------------------------------------------------------------------------------------------*/
	#person .contents {
		align-items: center;
		column-gap: var(--margin-60);
	}
	/*-----------------------------------------------------------------------------------------------*/

	/*-----------------------------------------------------------------------------------------------*/
	/* よくある質問 ---------------------------------------------------------------------------------*/
	/*-----------------------------------------------------------------------------------------------*/
	#top #faqlist .button,
	#top #recruitlist .button,
	#faq .main .button { gap: var(--margin-40); }
	#top #faqlist .button p,
	#top #recruitlist .button p,
	#faq .main .button p { width: calc((100% - var(--margin-40)) / 2); }
	/*-----------------------------------------------------------------------------------------------*/

	/*-----------------------------------------------------------------------------------------------*/
	/* 募集要項 -------------------------------------------------------------------------------------*/
	/*-----------------------------------------------------------------------------------------------*/
	#recruit .table > dl > dt,
	#recruit .table > dl > dd { padding: var(--margin-30); }
	#recruit .table .type > ol > li {
		padding-right: var(--margin-30);
		padding-left: var(--margin-30);
	}
	/* 選考フロー -----------------------------------------------------------------------------------*/
	#recruit .flow dl {
		flex-direction: row;
		align-items: center;
	}
	#recruit .flow dt {
		padding-bottom: 0;
		width: 94px;
	}
	#recruit .flow dd {
		flex: 1;
		display: flex;
		flex-direction: column;
		justify-content: center;
		border-top: none;
		border-left: var(--color-gray) solid 1px;
		padding-top: 0;
		min-height: 95px;
		padding-left: var(--margin-20);
	}
	/*-----------------------------------------------------------------------------------------------*/

	/*-----------------------------------------------------------------------------------------------*/
	/* トップ ---------------------------------------------------------------------------------------*/
	/*-----------------------------------------------------------------------------------------------*/
	/* リスト */
	#top .contents.list > li { width: calc((100% - (var(--margin-20) * 2)) / 3); }
	/* MOVIE ----------------------------------------------------------------------------------------*/
	#top .mainimage .catch { letter-spacing: 0.3em; }
	/* 募集要項  ------------------------------------------------------------------------------------*/
	/*#top #recruitlist .button p { width: calc((100% - (var(--margin-40)) * 2) / 3); }*/
	/*-----------------------------------------------------------------------------------------------*/
}



@media(min-width: 1280px) {
	/*-----------------------------------------------------------------------------------------------*/
	/* MSRとは --------------------------------------------------------------------------------------*/
	/*-----------------------------------------------------------------------------------------------*/
	/* 事業アウトライン -----------------------------------------------------------------------------*/
	#about .outline ul { justify-content: flex-start; }
	#about .outline li { width: calc((100% - (var(--margin-20) * 2)) / 3); }
	/* MSR6つの強み ---------------------------------------------------------------------------------*/
	#about .strengths .contents .item { width: calc((100% - (var(--margin-60) * 2)) / 3); }
	/*-----------------------------------------------------------------------------------------------*/

	/*-----------------------------------------------------------------------------------------------*/
	/* 仕事を知る -----------------------------------------------------------------------------------*/
	/*-----------------------------------------------------------------------------------------------*/
	/* その他の事業を見る ---------------------------------------------------------------------------*/
	#work .work .button li { width: calc((100% - (var(--margin-20) * 3)) / 4); }
	/*-----------------------------------------------------------------------------------------------*/

	/*-----------------------------------------------------------------------------------------------*/
	/* 福利厚生 -------------------------------------------------------------------------------------*/
	/*-----------------------------------------------------------------------------------------------*/
	/* 休暇 -----------------------------------------------------------------------------------------*/
	#welfare .vacation { gap: var(--margin-30); }
	#welfare .vacation > div { width: calc((100% - var(--margin-30)) / 2); }
	#welfare .vacation .num { font-size: 6.8rem;/*8.5rem;*/ }
	#welfare .vacation .unit { font-size: 2.0rem;/*2.6rem;*/ }
	/* 入寮希望者の負担額 ---------------------------------------------------------------------------*/
	#welfare .cost .price span { font-size: 5.6rem;/*7.0rem;*/ }
	#welfare .cost .price .between { font-size: 3.0rem;/*3.8rem;*/ }
	/*-----------------------------------------------------------------------------------------------*/

	/*-----------------------------------------------------------------------------------------------*/
	/* 教育制度 -------------------------------------------------------------------------------------*/
	/*-----------------------------------------------------------------------------------------------*/
	/* 新入社員研修 ---------------------------------------------------------------------------------*/
	#education .training .item { padding: var(--margin-40) var(--margin-30); }
	/*-----------------------------------------------------------------------------------------------*/
}