@charset "UTF-8";


/* ========================================================
  
  Variables

======================================================== */
.page-dr {
	--accent-color-100: #ddf0f6;
	--accent-color-200: #ade0f0;

	.p-tabs {
		> li {
			background-color: #9adbed;
		}
	}
	.benefits {
		--accent-color: #f29849;
	}
}
.page-dh {
	--accent-color-100: #fee5ea;
	--accent-color-200: #fed5de;

	.p-tabs {
		> li {
			background-color: #fc7694;
		}
	}
	.benefits {
		--accent-color: #6cb4de;
	}
}
.page-da {
	--accent-color-100: #ffebd5;
	--accent-color-200: #ffdfbc;

	.p-tabs {
		> li {
			background-color: #ff9319;
		}
	}
	.benefits {
		--accent-color: #90c435;
	}
}
.page-dt {
	--accent-color-100: #f1e2f5;
	--accent-color-200: #e9d1f0;

	.p-tabs {
		> li {
			background-color: #a75fc1;
		}
	}
	.benefits {
		--accent-color: #6d8fe8;
	}
}
.page-office {
	--accent-color-100: #d7f0e5;
	--accent-color-200: #c8eadb;

	.p-tabs {
		> li {
			background-color: #43b080;
		}
	}
	.benefits {
		--accent-color: #c7a1db;
	}
}
.page-visit {
	--accent-color-100: #e4f0d7;
	--accent-color-200: #daeac8;

	.p-tabs {
		> li {
			background-color: #77b536;
		}
	}
	.benefits {
		--accent-color: var(--color-pnk-300);
	}
}
/* PC,Tablet (Portrait)
------------------------------------------*/
@media only screen and (min-width: 768px) {

.page-dt {
	.career-step {
		margin-top: 0;
	}
}
}



/* ========================================================
  
  common

======================================================== */
.c-bg-color {
	background-color: #f9f8ef;
}
.c-bg-img {
	color: var(--accent-color) !important;
	opacity: 0.25;
}
.c-hdg--deco {
	--color-grd: #ebdcb5;
}

:where(.guideline, .curriculum, .benefits) {
	.c-bg-color { 
		background-color: var(--accent-color);
	}
	.c-title--enjp {
		color: #FFF;

		.c-hdg--min > span {
			display: block;
			font-size: 142%;
		}
	}
	.c-hdg--deco {
		--color-grd: rgb(255 251 171 / 0.75);
		background-color: rgb(255 255 255 / 0.25);
	}
}


/*-----------------------------------------------
 page common - p-tabs
-----------------------------------------------*/
.p-tabs {
	display: grid;
	grid-template-columns: repeat(4, min(19em,24.2%));
	justify-content: space-between;
	row-gap: 1.2em;
	font-size: min(1.4vw,1rem);
	font-weight: var(--fw-bold);
	line-height: 1.4;
	letter-spacing: .1em;
	word-break: keep-all;
    overflow-wrap: break-word;
	margin-bottom: 3.5em;

	> li {
		position: relative;
		height: 4.4em;
		display: flex;
		flex-direction: column;
		justify-content: center;
		text-align: center;
		color: rgb(84 63 52 / 0.4);
		padding: .5em;
		border-radius: 100vmax;
		cursor: pointer;
		transition: color .5s, background-color .5s;

		&.is-active,
		&:hover {
			color: var(--color-brw);
			background-color: #fff !important;
		}
	}
}
/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {

.p-tabs {
	grid-template-columns: repeat(2,49%);
	row-gap: .6em;
	font-size: 80%;
	letter-spacing: .06em;
	margin-bottom: 8%;

	> li {
		height: 4.4em;
	}
}
}


/*-----------------------------------------------
 page common - p-bg-circle
-----------------------------------------------*/
.p-bg-circle {
	position: absolute;
	width: 80vw;
	max-width: 1230px;
	aspect-ratio: 1;
	border-radius: 50%;
	background: linear-gradient(150deg, #f7e8bc, transparent 40%);
	left: 54%;
	top: 0;
	translate: 0 -7.5%;
	z-index: -1;
}


/*-----------------------------------------------
 page common - p-anchor-list
-----------------------------------------------*/
.p-anchor-list {
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	gap: 1em 2.5%;
	color: var(--color-brw);
	text-align: center;
	font-size: min(1.5vw,112%);
	font-weight: var(--fw-bold);
	letter-spacing: .1em;
	line-height: 1.2;
	margin-inline: auto;

	> li {
		flex: 1;
	}
	& a {
		position: relative;
		height: 6em;
		display: flex;
		flex-direction: column;
		justify-content: center;
		background: linear-gradient(to bottom, #f9f8ef, transparent);
		padding: 1.5em 0;
		border-radius: 1em 1em 0 0;

		&::before {
			position: absolute;
			display: block;
			font-family: 'fontello';
			content: '\e801';
			font-weight: normal;
			text-align: center;
			font-size: 72%;
			width: 2.8em;
			line-height: 2.8;
			background-color: #fff;
			border-radius: 50%;
			rotate: 90deg;
			box-shadow: 4px 0 6px rgb(104 85 7 / 0.2);
			inset: auto 0 -1.6em 0;
			margin: auto;
			transition: background-color .5s;
		}
		&:hover {
			&::before {
				background-color: var(--accent-color-100);
			}
		}
	}
}

/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {

.p-anchor-list {
	flex-wrap: wrap;
	gap: 2em 2%;
	font-size: 90%;
	letter-spacing: .08em;

	> li {
		flex: auto;
		width: 32%;
	}
}
}


/*-----------------------------------------------
 page common - p-bglist
-----------------------------------------------*/
.p-bglist {
	position: relative;

	> li {
		background-color: #f9f8ef;
		padding: 11% 9%;
		border-radius: 1em;
	}
	.c-hdg--bld {
		text-align: center; 
		font-size: min(2.2vw,180%);
		font-feature-settings: "palt";
		letter-spacing: .1em;

		> span {
			color: var(--accent-color);
		}
	}
}
.p-bglist__icon {
	position: relative;
	width: 35%;
	max-width: max-content;
	margin: 0 auto 1em;
}
.p-bglist__point {
	width: 100%;
	display: grid;
	justify-content: space-between;
	grid-template-columns: repeat(2,48.2%);
	row-gap: 1em;
	color: var(--color-brw);
	text-align: center;
	font-size: min(1.8vw,150%);
	font-weight: var(--fw-bold);
	letter-spacing: .1em;
	line-height: 1.2;
	margin-inline: auto;

	> li {
		position: relative;
		height: 4.5em;
		display: flex;
		flex-direction: column;
		justify-content: center;
		background-color: #fff;
		border: 1px solid var(--accent-color);
		padding: 1em 2%;
		border-radius: .8em;

		& span {
			display: block;
			color: var(--accent-color);
			font-size: 125%;
			margin-top: .2em;
		}
		& sub {
			font-size: 53%;
			letter-spacing: .1em;
			font-feature-settings: "palt";
			vertical-align: 0.1em;
		}
	}
}
/* PC,Tablet (Portrait)
------------------------------------------*/
@media only screen and (min-width: 768px) {

.p-bglist {
	display: flex;
	flex-wrap: wrap;
	gap: 2em 3%;
	
	> li {
		width: 31.3%;
		padding: 2.7%;

		&.size-half {
			width: 48.5%;
		}
		&.size-max {
			width: 100%;
			padding: 4.5%;

			.c-hdg--bld {
				text-align: left;
				letter-spacing: .1em;
			}
		}
	}
}
.p-bglist__inner {
	max-width: 1040px;
	margin-inline: auto;

	&.is-col2 {
		display: grid;
		justify-content: space-between;
		align-items: center;
		grid-template-columns: 42% 54%;
	}
}
}
/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {

.p-bglist {
	display: grid;
	row-gap: .6em;
	
	> li {
		padding: 8%;
	}
	.c-hdg--bld {
		font-size: 130%;
	}
}
.p-bglist__icon {
	width: 25%;
}
.p-bglist__point {
	row-gap: .6em;
	font-size: 85%;
	margin-top: 6%;
}
}


/*-----------------------------------------------
 page common - p-joblist
-----------------------------------------------*/
.p-joblist {
	position: relative;
	display: flex;
	flex-wrap: wrap;
	gap: .5em;
	text-align: center; 
	font-size: min(1.5vw,100%);
	font-weight: var(--fw-bold);
	line-height: 1.3;
	letter-spacing: .1em;
	margin-bottom: 1em;

	> li {
		flex: 1 1 auto;
		color: #FFF;
		background-color: #c2b086;
		padding: .6em 1em;
		border-radius: 2em;
	}
}
/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {

.p-joblist {
	font-size: 90%;
}
}




/*---------------------------------------------------------
 flow
---------------------------------------------------------*/
.p-flow {
	position: relative;
	color: #FFF;
	border: 1px solid currentColor;
	border-radius: 1em;
	padding: 7% 3% 6%;
	margin-inline: auto;

	.c-hdg--min {
		position: absolute;
		white-space: nowrap;
		background-color: var(--accent-color);
		padding: 0 3em;
		inset: 0 auto auto 50%;
		translate: -50% -50%;
	}
	.c-txt--ast {
		position: absolute;
		text-align: right;
		font-size: 75%;
		font-weight: var(--fw-bold);
		right: 2em;
		bottom: 1em;
	}
}
/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {

.p-flow {
	padding: 10% 5% 8%;

	.c-hdg--min {
		padding: 0 1em;
	}
	.c-txt--ast {
		position: relative;
		font-size: 60%;
		inset: auto;
		margin-top: 2em;
	}
}
}

/* flow - p-flow-list
-----------------------------------------------*/
.p-flow-list {
	position: relative;
	max-width: 1056px;
	display: grid;
    grid-template-columns: repeat(4,25%);
	margin-inline: auto;
	counter-reset: flowCounter;
	list-style: none;

	> li {
		position: relative;
		text-align: center;

		display: grid;
		grid-template-rows: subgrid;
		grid-row: span 3;

		&:last-of-type {
			.p-flow-list__img::after {
				display: none;
			}
		}
	}
}
.p-flow-list__img {
	position: relative;
	width: 85%;
	max-width: max-content;
	margin: 0 auto 5%;

	&::after {
		position: absolute;
		font-family: 'fontello'; 
		content: '\e801';
		font-size: min(2vw,140%);
		font-weight: normal;
		left: 109%;
		top: 50%;
		translate: -50% -50%;
	}
}
.p-flow-list__no {
	position: relative;
	counter-increment: flowCounter;
	color: var(--accent-color-200);
	font: var(--font-en);
	font-size: min(5vw,383%);
	letter-spacing: .08em;
	margin-top: -0.5em;
	
	&::before {
		content: counter(flowCounter, decimal-leading-zero);
	}
}
.p-flow-list__txt {
	display: flex;
	flex-direction: column;
	justify-content: center;
	font-size: min(1.7vw,125%);
	font-weight: var(--fw-bold);
	line-height: 1.4;
	font-feature-settings: "halt";
}

/*5列*/
.p-flow-list.is-col5 {
	max-width: 1075px; 
    grid-template-columns: repeat(5,20%);

	.p-flow-list__img {
		width: 78%;

		&::after {
			left: 115%;
		}
	}
}
/* PC,Tablet
------------------------------------------*/
@media only screen and (min-width: 768px) {

}
/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {

/* p-flow-list */
.p-flow-list {
   min-width: max-content;

	> li {
		width: 45vw;
	}
}
.p-flow-list__img {
	margin-bottom: .8em;

	&::after {
		font-size: 120%;
	}
}
.p-flow-list__no {
	font-size: 10vw;
}
.p-flow-list__txt {
	font-size: 95%;
}
}



/* ========================================================
  
  deco

======================================================== */

/*---------------------------------------------------------
 Petal
---------------------------------------------------------*/

/* Petal - Lead
-----------------------------------------------*/
.lead .c-petal-wrap {
	--wrap-width: 400;
	--wrap-height: 500;

	width: 26%;
	aspect-ratio: 4/5;

	&.is-left {
		left: 0;
		top: min(22vw,350px);

		.c-petal {
			&.p01 {
				--x: 170;
				--y: 85;
				--rotate: 140deg;
			}
			&.p02 {
				--x: 250;
				--y: 218;
				--rotate: -130deg;
			}
			&.p03 {
				--x: 114;
				--y: 342;
				--rotate: 35deg;
			}
			&.p04 {
				--x: 233;
				--y: 397;
				--rotate: -45deg;
			}
		}
	}
	&.is-right {
		right: 0;
		top: min(7.8vw,120px);

		.c-petal {
			&.p01 {
				--x: 290;
				--y: 70;
				--rotate: -35deg;
			}
			&.p02 {
				--x: 190;
				--y: 208;
				--rotate: 0deg;
			}
			&.p03 {
				--x: 266;
				--y: 362;
				--rotate: 120deg;
			}
			&.p04 {
				--x: 140;
				--y: 456;
				--rotate: 35deg;

				scale: -0.8 0.8 !important;
			}
		}
	}
}
/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {

.lead .c-petal-wrap {
	width: 40%;
	height: 60vw;

	&.is-left {
		left: -10%;
		top: 60vw;
	}
	&.is-right {
		right: -6%;
		top: 0;
	}
}
}

/* Petal - Voice
-----------------------------------------------*/
.voice .c-petal-wrap {
	--wrap-width: 1185;
	--wrap-height: 670;

	inset: 0;
	z-index: 1;
}
.voice .c-petal {
	width: 8vw;
	max-width: 120px;

	&.p01 {
		--x: 5;
		--y: 490;
		--rotate: -30deg;
	}
	&.p02 {
		--x: 1010;
		--y: 10;
		--rotate: 200deg;
	}
}
/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {

.voice .c-petal-wrap {
	height: 80vw;
}
.voice .c-petal {
	width: 12vw;
}
}


/* ========================================================
  
  main

======================================================== */

/*---------------------------------------------------------
 Lead
---------------------------------------------------------*/
.lead {
	.l-col-list {
		.c-hdg--bld {
			text-align: center;
			color: var(--color-brw);

			> span {
				color: var(--accent-color);
			}
		}
	}
	.c-mv-wrap {
		max-width: 1070px;
	}
}



/*---------------------------------------------------------
 Guideline
---------------------------------------------------------*/
.guideline-status {
	text-align: center;
	color: var(--color-red);
	font-size: 112%;
	font-weight: var(--fw-bold);
	line-height: 1.8;
	margin-bottom: 2em;
}
/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {

.guideline-status {
	font-size: 100%;
	line-height: 1.6;
	margin-bottom: 1.6em;
}
}


/* Guideline - table
-----------------------------------------------*/
.guideline-tbl {
	width: 100%;
	font-size: min(1.8vw,1rem);
	background-color: #fff;
	border-collapse: collapse;

	& tr {
		border-bottom: 1px solid #b3b2ab;
	}
	& th,
	& td {
		padding: 2em 3%;
	}
	& th {
		width: 20%;
		color: var(--color-brw);
		background-color: var(--accent-color-100);
		vertical-align: top;
	}
	& td {
		> * {
			margin-top: 1em;

			&:first-child {
				margin-top: 0;
			}
		}
	}
	& address {
		margin-top: 1em;
	}
}
/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {

.guideline-tbl {
	font-size: 100%;

	& th,
	& td {
		display: block;
		padding: 1em 6%;
	}
	& th {
		width: 100%;
	}
	& td {
		font-size: 90%;
	}
}
}


/*---------------------------------------------------------
 career
---------------------------------------------------------*/
.career {
	
}
/* PC,Tablet (Portrait)
------------------------------------------*/
@media only screen and (min-width: 768px) {

.career {
	.c-title--enjp {
		margin-bottom: 2%;
	}
}
.career__lead {
	width: 80%;
}
.career__col2 {
	display: grid;
	grid-template-columns: 46% 50%;
	justify-content: space-between;
	margin-top: 5%;
}
}
/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {

.career__col2 {
	.career-step {
		margin-bottom: 8%;
	}
}
}

/* career - career-step
-----------------------------------------------*/
.career-step {
	display: flex;
	align-items: flex-end;

	> li {
		--base-height: 200px;
		--step: 60px;

		position: relative;
		flex: 1;
		display: flex;
		height: calc(var(--base-height) + var(--level, 0) * var(--step));

		&:nth-child(1) { --level: 0; z-index: 10; }
		&:nth-child(2) { --level: 1; z-index: 9; }
		&:nth-child(3) { --level: 2; z-index: 8; }
		&:nth-child(4) { --level: 3; z-index: 7; }
		&:nth-child(5) { --level: 4; z-index: 6; }
		&:nth-child(6) { --level: 5; z-index: 5; }
		&:nth-child(7) { --level: 6; z-index: 4; }
	}
	& dl {
		position: relative;
		width: 100%;
		height: 100%;
		color: #fff;
		padding: 2.5em 10% 2.2em;

		> dt {
			text-align: center;
			font-size: min(1.8vw,160%);
			letter-spacing: .1em;
		}
		> dd {
			font-size: 94%;
			line-height: 1.7;
		}
		&::before {
			position: absolute;
			content: "";
			background: linear-gradient(to right, var(--color-grd-b), var(--color-grd-a));
			width: 100%;
			height: 100%;
			inset: auto 0 0 0;
			z-index: -1;
		}
	}
}

.career-step--dr {
	> li {
		&:nth-child(1) {
			--color-grd-b: #06ba4e;
			--color-grd-a: #92d69b;
		}
		&:nth-child(2) {
			--color-grd-b: #00a897;
			--color-grd-a: #68d4a7;
		}
		&:nth-child(3) {
			--color-grd-b: #008cab;
			--color-grd-a: #68c7d4;
		}
		&:nth-child(4) {
			--color-grd-b: #00b5c2;
			--color-grd-a: #4de5f0;
		}
		&:nth-child(5) {
			--color-grd-b: #00b6f2;
			--color-grd-a: #8ddaf0;
		}
		&:nth-child(6) {
			--color-grd-b: #2981d9;
			--color-grd-a: #17b5e2;
		}
		&:nth-child(7) {
			--color-grd-b: #044fd9;
			--color-grd-a: #3db1eb;
		}
	}
}
.career-step--dh {
	> li {
		&:nth-child(1) {
			--color-grd-b: #8444b8;
			--color-grd-a: #ae97cf;
		}
		&:nth-child(2) {
			--color-grd-b: #9844ab;
			--color-grd-a: #cc88eb;
		}
		&:nth-child(3) {
			--color-grd-b: #b81c8e;
			--color-grd-a: #e178e3;
		}
		&:nth-child(4) {
			--color-grd-b: #c70074;
			--color-grd-a: #ff7dcf;
		}
		&:nth-child(5) {
			--color-grd-b: #c92c8d;
			--color-grd-a: #ffb0e7;
		}
		&:nth-child(6) {
			--color-grd-b: #d9277a;
			--color-grd-a: #ff91ab;
		}
		&:nth-child(7) {
			--color-grd-b: #ff3351;
			--color-grd-a: #fc96ad;
		}
	}
}
.career-step--da {
	> li {
		&:nth-child(1) {
			--color-grd-b: #e64040;
			--color-grd-a: #ff6969;
		}
		&:nth-child(2) {
			--color-grd-b: #fa7a7a;
			--color-grd-a: #ffbaba;
		}
		&:nth-child(3) {
			--color-grd-b: #f27777;
			--color-grd-a: #edc618;
		}
		&:nth-child(4) {
			--color-grd-b: #dba500;
			--color-grd-a: #cfc800;
		}
		&:nth-child(5) {
			--color-grd-b: #d99204;
			--color-grd-a: #ebc21f;
		}
		&:nth-child(6) {
			--color-grd-b: #d97109;
			--color-grd-a: #f0ba18;
		}
		&:nth-child(7) {
			--color-grd-b: #f05c00;
			--color-grd-a: #eba03d;
		}
	}
}
.career-step--dt {
	> li {
		--base-height: 250px;
		
		&:nth-child(1) {
			--color-grd-b: #964896;
			--color-grd-a: #d47fa0;
		}
		&:nth-child(2) {
			--color-grd-b: #62328c;
			--color-grd-a: #c78dd9;
		}
	}
}
.career-step--office {
	> li {
		&:nth-child(1) {
			--color-grd-b: #d46719;
			--color-grd-a: #ffae70;
		}
		&:nth-child(2) {
			--color-grd-b: #fa8c26;
			--color-grd-a: #d4ad11;
		}
		&:nth-child(3) {
			--color-grd-b: #c4a700;
			--color-grd-a: #8ed13d;
		}
		&:nth-child(4) {
			--color-grd-b: #52a300;
			--color-grd-a: #9fc95f;
		}
		&:nth-child(5) {
			--color-grd-b: #2e8a20;
			--color-grd-a: #5dc969;
		}
		&:nth-child(6) {
			--color-grd-b: #05824c;
			--color-grd-a: #13ba53;
		}
		&:nth-child(7) {
			--color-grd-b: #007d51;
			--color-grd-a: #61c498;
		}
	}
}
.career-step--visit {
	> li {
		--base-height: 330px;
		--step: 80px;

		&:nth-child(1) {
			--color-grd-b: #81c232;
			--color-grd-a: #8ad47f;
		}
		&:nth-child(2) {
			--color-grd-b: #328c41;
			--color-grd-a: #94c461;
		}
	}
}
/* PC,Tablet (Portrait)
------------------------------------------*/
@media only screen and (min-width: 768px) {

.career-step {
	margin-top: -8%;
}
.career__col2 {
	.career-step {
		margin-top: 0;
	}
}
}
/* Tablet (Portrait)
------------------------------------------*/
@media only screen and (min-width: 768px) and (max-width: 959px) {

.career-step {
	> li {
		--step: 40px;
	}
	& dl {
		padding: 1.5em 10% 2.2em;

		> dd {
			font-size: 90%;
			line-height: 1.5;
		}
	}
}
}
/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {

.career-step {
	display: block;
	width: 92%;
	margin-inline: auto;
	margin-top: 10%;

	> li {
		--arw-height: 15px;
		--bg-height: calc(100% - var(--arw-height));

		display: block;
		height: auto;

		&:last-of-type {
			> dl::before {
				clip-path: none;
			}
		}
		&:nth-of-type(n+2) {
			margin-top: -16px;
		}
	}
	& dl {
		padding: 10% 10% 12%;
		
		> dt {
			font-size: 120%;
		}
		&::before {
			height: calc(100% + var(--arw-height));
			height: 100%;
			clip-path: polygon(0 0, 100% 0, 100% var(--bg-height), 55% var(--bg-height), 50% 100%, 45% var(--bg-height), 0 var(--bg-height));
			inset: auto 0 -15px 0;
			inset: 0;
		}
	}
}
}

/* career - career-ex
-----------------------------------------------*/
.career-ex {
	position: relative;
	display: grid;
	grid-template-columns: repeat(4,23.8%);
	justify-content: space-between;
	padding-top: min(6vw,65px);

	> li {
		display: grid;
		grid-template-rows: subgrid;
		grid-row: span 4;
		gap: 0;
		color: var(--color-brw);
		font-weight: var(--fw-bold);
		line-height: 1.3;
		background-color: #FFF;
		padding: 1px 7% 10%;
	}
	.c-hdg--bld {
		text-align: center;
		> span {
			color: var(--accent-color);
		}
	}
	.career-ex__note {
		display: block;
		text-align: center;
		font-size: 68%;
	}

	&.is-col2 {
		grid-template-columns: repeat(2,49.2%);
	}
}
.career-ex__icon {
	position: relative;
	width: 50%;
	max-width: max-content;
	margin: -26% auto 6%;
}
.career-ex__post {
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: center;
	text-align: center;
	color: #FFF;
	font-size: min(1.7vw,105%);
	letter-spacing: .1em;
	background-color: var(--accent-color);
	padding: .3em;
	border-radius: 2em;
	margin-bottom: 1em;
}
.career-ex__income {
	width: 96%;
	max-width: 230px;
	display: flex;
	align-items: center;
	gap: .5em;
	font-size: min(1.2vw,94%);
	white-space: nowrap;
	margin: .4em auto;

	> dt {
		min-width: 3.5em;
		text-align: center;
		line-height: 3.5;
		background-color: #f9f8ef;
		border-radius: 50%;
	}
	> dd {
		font-size: 113%;

		> span {
			font-size: 252%;
			letter-spacing: .1em;
		}
	}
}
.career-ex__note {
	text-align: right;
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-end;
	gap: .2em 1.2em;
	color: var(--color-brw);
	font-size: 75%;
	font-weight: var(--fw-bold);
	line-height: 1.4;
	font-feature-settings: "palt";
	margin-top: 1.5em;
}

/* color */
.career-ex--dr {
	> li {
		&:nth-child(1) { --accent-color: #137f7c; }
		&:nth-child(2) { --accent-color: #f27e7e; }
		&:nth-child(3) { --accent-color: #32a3c2; }
		&:nth-child(4) { --accent-color: #4d578c; }
	}
}
.career-ex--dh {
	> li {
		&:nth-child(1) { --accent-color: #f27e7e; }
		&:nth-child(2) { --accent-color: #219ebc; }
		&:nth-child(3) { --accent-color: #76c769; }
		&:nth-child(4) { --accent-color: #e3b647; }
	}
}
.career-ex--da {
	> li {
		&:nth-child(1) { --accent-color: #6a843c; }
		&:nth-child(2) { --accent-color: #ea7a53; }
		&:nth-child(3) { --accent-color: #7f4649; }
		&:nth-child(4) { --accent-color: #219ebc; }
	}
}
.career-ex--dt {
	> li {
		grid-row: span 3;

		&:nth-child(1) { --accent-color: #54c47f; }
		&:nth-child(2) { --accent-color: #cf895b; }
		&:nth-child(3) { --accent-color: #519db8; }
		&:nth-child(4) { --accent-color: #db9393; }
	}
}
.career-ex--office {
	> li {
		&:nth-child(1) { --accent-color: #255384; }
		&:nth-child(2) { --accent-color: #bc86c9; }
		&:nth-child(3) { --accent-color: #d3a06e; }
		&:nth-child(4) { --accent-color: #ea7b21; }
	}
}
.career-ex--visit {
	> li {
		&:nth-child(1) { --accent-color: #94c461; }
		&:nth-child(2) { --accent-color: #8a7bba; }
	}
}
/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {

.career-ex {
	grid-template-columns: repeat(2,49%);
	row-gap: 2em;

	> li {
	}
}
.career-ex__icon {
	width: 40%;
	margin: -12% auto 5%;
}
.career-ex__post {
	font-size: 90%;
}
.career-ex__income {
	font-size: 70%;

	> dd {
		font-size: 105%;

		> span {
			font-size: 220%;
		}
	}
}
.career-ex__note {
	margin-top: 1.2em;
}
}

/* career - career-way
-----------------------------------------------*/
.career-way {
	background-color: #FFF;
	padding: min(10%,120px) 1.2% 5%;

	.c-hdg--bbl {
		position: absolute;
		width: 13em;
		height: 3.5em;
		background-color: #bf9b41;
		inset: -1em 0 auto 0;
		margin: auto;
	}
}
.career-way__list {
	position: relative;
	display: grid;
	justify-content: space-between;

	.c-hdg--bld {
		text-align: center;
		color: var(--color-brw);
		font-size: min(2.2vw,150%);
	}
}
.career-way__icon {
	position: relative;
	width: 35%;
	max-width: max-content;
	margin: 5% auto 6%;
}
/* PC,Tablet (Portrait)
------------------------------------------*/
@media only screen and (min-width: 768px) {

.career-way__list {
	grid-template-columns: repeat(3,33.3%);

	> li {
		padding: 0 9.5%;
		border-right: 1px solid var(--color-bdr);

		&:last-child {
			border-right: none;
		}
	}
}
}
/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {

.career-way {
	padding: 20% 7% 10%;

	.c-hdg--bbl {
		position: absolute;
		background-color: #bf9b41;
		inset: -1em 0 auto 0;
		margin: auto;
	}
}
.career-way__list {

	> li {
		&:nth-of-type(n+2) {
			padding-top: 8%;
			margin-top: 8%;
			border-top: 1px solid var(--color-bdr);
		}
	}
	.c-hdg--bld {
		font-size: 120%;
	}
}
.career-way__icon {
	width: 25%;
}
}

/* career - sidejob
-----------------------------------------------*/
.sidejob {
	position: relative;
	color: #FFF;
	background-color: #bf9b41;
	border-radius: 1.8em;
	padding: 6% 4.5% 6%;
	margin-inline: auto;
}
.sidejob__ttl {
	display: flex;
	align-items: center;
	column-gap: 1.2em;

	text-align: center;
	font-size: min(2.2vw,150%);
	font-weight: var(--fw-bold);
	line-height: 1.6;
	letter-spacing: .1em;
	white-space: nowrap;
	margin-bottom: 0;

	> div {
		width: 5em;
	}
	& span {
		color: #fffbb3;
	}
}
/* PC,Tablet (Portrait)
------------------------------------------*/
@media only screen and (min-width: 768px) {

.sidejob {
	display: flex;
	align-items: center;
	column-gap: 6%;
}
}
/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {

.sidejob {
	border-radius: 1.2em;
	padding: 8% 6%;
}
.sidejob__ttl {
	font-size: 110%;
	margin-bottom: .5em;
}
}


/*---------------------------------------------------------
 Curriculum
---------------------------------------------------------*/
.curriculum {

}


/*---------------------------------------------------------
 Benefits
---------------------------------------------------------*/
.benefits {

}


/*---------------------------------------------------------
 Voice
---------------------------------------------------------*/
.voice {

}

/* Voice - slide
-----------------------------------------------*/
.voice-slide {
	width: 94%;
	max-width: 1185px;
	margin-inline: auto;

	.swiper-slide {
		height: auto !important;
		background-color: #fff;
		padding: 8.4% 6%;
	}
}
.voice-name {
	text-align: center;
	font: var(--font-min);
	font-size: min(2vw,135%);
	line-height: 1.4;
	letter-spacing: .1em;
	margin-top: 1.4em;

	> dt {
		margin-bottom: .3em;

		&:nth-child(2) {
			font-size: 85%;
			font-feature-settings: "palt";
		}
	}
	> dd {
		font-size: 126%;
		letter-spacing: .1em;
	}
	.u-font--en {
		color: var(--color-brw);
		font-size: 82%;
		letter-spacing: .08em;
		margin-top: .4em;
	}
}
.voice-slide__txt {
	.c-hdg--min {
		color: var(--color-brw);
	}
}

/* arrow */
.swiper-button {
	position: absolute;
	display: block;
	background: #bf9b41 url(../images/common/icon_arrow.svg) no-repeat center center;
	background-size: contain;
	border-radius: 50%;
	width: 10%;
	max-width: 66px;
	aspect-ratio: 1;
	top: 46%;
	cursor: pointer;
	transition: background-color .5s;
	
	&.swiper-button-prev {
		left: 0;
		translate: -55% -50%;
		scale: -1 1;
	}
	&.swiper-button-next {
		right: 0;
		translate: 55% -50%;
	}
	&.swiper-button:hover {
		background-color: var(--color-brw);
	}
}
/* PC,Tablet (Portrait)
------------------------------------------*/
@media only screen and (min-width: 768px) {

.voice-slide__inner {
	max-width: 900px;
	display: grid;
	justify-content: space-between;
	grid-template-columns: 37% 55%;
	margin-inline: auto;
}
}
/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {

.voice-slide {
	width: 94%;

	.swiper-slide {
		padding: 8% 8% 10%;
	}
}
.voice-slide__img {
	display: grid;
	justify-content: space-between;
	align-items: center;
	grid-template-columns: 45% 60%;
}
.voice-name {
	font-size: 90%;
	letter-spacing: .06em;
	margin-top: 0;
}
.voice-slide__txt {
	margin-top: 6%;
	
	.c-hdg--min {
		text-align: center;
	}
}
/* arrow */
.swiper-button {
	width: 10%;
}
}


/*---------------------------------------------------------
 Form
---------------------------------------------------------*/
.l-form {
	.p-flow {
		margin-top: min(8%,65px);

		.c-hdg--min {
			background-color: var(--color-brw-300);
		}
		.p-flow-list__no {
			color: #b1a29b;
		}
	}
}
/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {

.l-form {
	.p-flow {
		margin-top: 10%;
	}
}
}


/*---------------------------------------------------------
 
---------------------------------------------------------*/

/*  - 
-----------------------------------------------*/

/* PC,Tablet (Portrait)
------------------------------------------*/
@media only screen and (min-width: 768px) {

}
/* Tablet (Portrait)
------------------------------------------*/
@media only screen and (min-width: 768px) and (max-width: 959px) {

}
/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {


}