@charset "utf-8";
/* ------------------------------
 h1 ページタイトル（PC）
------------------------------ */
.officeTop .heading {
	position: relative;
	background: none;
	margin-bottom: 70px;
}
.officeTop .heading .headingIn {
	position: absolute;
	height: 100%;
	left: 0;
	right: 0;
	margin: auto;
}
.officeTop .heading .headingIn::before {
	content: "";
	display: block;
	position: absolute;
	top: 30px;
	left: -85px;
	width: 232px;
	height: 156px;
	background: url(../img/office_main_illustration01.png) no-repeat 0 0 / cover;
}
.officeTop .heading .headingIn::after {
	content: "";
	display: block;
	position: absolute;
	bottom: 286px;
	right: -70px;
	width: 206px;
	height: 116px;
	background: url(../img/office_main_illustration02.png) no-repeat 0 0 / cover;
}
/* h1 */
.officeTop .mainText {
	position: absolute;
	display: flex;
	flex-direction: column;
	justify-content: center;
	top: 0;
	left: 0;
	right: 0;
	margin: auto;
	z-index: 2;
}
.officeTop .mainText .cms_text {
	margin-bottom: 0;
}
.officeTop .mainText h1 {
	font-size: 4.6rem;
	line-height: 1.5;
	padding: 0 2.5%;
	font-weight: 600;
	letter-spacing: .05em;
}
.officeTop .mainText h1 span {
	display: inline-block;
	padding: 5px 15px 0 20px;
	border-radius: 8px;
	background-color: #fff;
}
.officeTop .mainText h1 span:not(:last-child) {
	margin-bottom: 18px;
}
@media print, screen and (min-width: 768px) {
	.officeTop .heading {
		height: 630px;
	}
	.officeTop .heading .headingIn {
		width: 95.85%;
		max-width: 1840px;
	}
	.officeTop .heading img.pc {
		width: 95.8%;
		max-width: 1840px;
		height: 100%;
		border-radius: 40px;
		margin: 0 auto;
		object-fit: cover;
	}
	.officeTop .phoneBox {
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
		width: 325px;
		height: 170px;
		background-color: var(--care-red);
		border-radius: 25px 0 0 25px;
		padding: 25px;
		position: absolute;
		bottom: -40px;
		right: -2.2%;
		z-index: 10;
	}
	.phone {
		position: relative;
		font-size: 1.8rem;
		font-weight: 600;
		color: #fff;
		text-align: center;
	}
	.phone::before, .phone::after {
		content: "";
		position: absolute;
		width: 15px;
		height: 7px;
		background-color: #e597a9;
		clip-path: polygon(100% 0, 0 0, 50% 100%);
		bottom: -6px;
		left: 0;
		right: 0;
		margin: auto;
		z-index: 1;
	}
	.phone::before {
		background-color: var(--care-red);
		bottom: -4px;
		z-index: 2;
	}
	.phone span {
		position: relative;
		display: inline-block;
		padding-bottom: 1px;
		border-bottom: solid 1px #e597a9;
	}
	.phone span::before {
		content: "";
		display: inline-block;
		width: 26px;
		height: 26px;
		margin: -7px 4px 0 0;
		background: url(../img/icon_phone.svg) no-repeat 0 0 / cover;
		vertical-align: middle;
	}
	.phoneBox > a {
		display: block;
		margin: 15px 0 0;
		font-family: "Rubik", sans-serif;
		font-size: 3.8rem;
		line-height: 1;
		font-weight: 500;
		text-align: center;
		color: #fff;
		letter-spacing: -0.015em;
	}
	.phoneBox > p {
		font-size: 1.5rem;
		letter-spacing: -0.05em;
		color: #fff;
	}
	/* h1 */
	.officeTop .mainText {
		width: 95.8%;
		max-width: 1840px;
		height: 630px;
	}
}
/* ------------------------------
 h1 ページタイトル（SP）
------------------------------ */
@media screen and (max-width: 767px) {
	.officeTop .heading {
		margin-bottom: 40px;
	}
	.officeTop .heading .headingIn::before {
		top: 15px;
		left: -30px;
		width: 140px;
		height: 94px;
	}
	.officeTop .heading .headingIn::after {
		width: 110px;
		height: 62px;
		bottom: 10px;
		right: -28px;
	}
	.officeTop .heading img.sp {
		max-width: initial;
		width: 90%;
		margin: 0 5%;
		border-radius: 20px;
	}
	.officeTop .phoneBox {
		display: none;
	}
	/* h1 */
	.officeTop .mainText {
		width: 90%;
		aspect-ratio: 750 / 1186;
	}
	.officeTop .mainText h1 {
		font-size: 2.6rem;
		text-align: center;
	}
	.officeTop .mainText h1 span {
		display: inline-block;
		padding: 4px 10px 0 10px;
		border-radius: 4px;
		background-color: #fff;
	}
	.officeTop .mainText h1 span:not(:last-child) {
		margin-bottom: 10px;
	}
}

/* ------------------------------
 見出し・テキスト（PC）
------------------------------ */
/* h2 */
.contents.officeTop h2 {
	position: relative;
	margin-bottom: 45px;
	padding-bottom: 30px;
	font-size: 4.7rem;
	line-height: 1;
	font-weight: 600;
}
.contents.officeTop h2 span {
	display: block;
	margin-bottom: 15px;
	color: var(--gray-color);
	font-family: "Rubik", sans-serif;
	font-size: 1.7rem;
	font-weight: 400;
	letter-spacing: .1em;
}
.contents.officeTop h2::after {
	content: "";
	display: block;
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	width: 82px;
	height: 12px;
	background: url(../img/icon_title.png) no-repeat center / cover;
}
.contents.officeTop h2::before {
	content: none;
}
/* h3 */
.contents.officeTop h3 {
	position: relative;
	margin-bottom: 15px;
	padding-bottom: 12px;
	font-size: 3.0rem;
	line-height: 1.3;
	font-weight: 600;
	text-align: center;
}
.contents.officeTop h3::after {
	content: "";
	display: block;
	width: 46px;
	height: 6px;
	background: url(../img/h3_decoration_officetop.png) no-repeat 0 0 / cover;
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	margin: auto;
}
/* ------------------------------
 見出し・テキスト（SP）
------------------------------ */
@media screen and (max-width: 767px) {
	/* h2 */
	.contents.officeTop h2 {
		margin-bottom: 30px;
		padding-bottom: 20px;
		font-size: 3.8rem;
		text-align: center;
	}
	.contents.officeTop h2::after {
		width: 64px;
		height: 9px;
		margin: auto;
	}
	.contents.officeTop h2 span {
		font-size: 1.4rem;
		margin-bottom: 12px;
	}
	/* h3 */
	.contents.officeTop h3 {
		margin-bottom: 0;
		padding-bottom: 8px;
		font-size: 2.2rem;
		text-align: left;
		height: fit-content;
	}
	.contents.officeTop h3::after {
		width: 34px;
		height: 6px;
		background: url(../img/h3_decoration_officetop_sp.png) no-repeat 0 0 / cover;
		right: auto;
	}
	/* メインリード */
	.contents.officeTop .lead-main {
		font-size: 2.6rem;
	}
}

/* ------------------------------
 下層ページリンク（PC）
------------------------------ */
.officeTop .linkBlock {
	position: relative;
	z-index: 1;
	width: 95.8%;
	background-color: var(--base-color);
	border-radius: 40px;
	padding: 100px 0 110px;
	margin: 0 auto 100px;
}
.officeTop .linkBlock ul {
    display: flex;
    flex-flow: row wrap;
    gap: 40px 0;
}
.officeTop .linkBlock ul > li {
	padding-left: 0;
	margin-bottom: 0;
}
.officeTop .linkBlock ul > li::before {
	content: none;
}
.officeTop .linkBlock ul > li a {
	display: block;
	width: 100%;
	height: 100%;
	color: var(--main-font-color);
	text-decoration: none;
	font-weight: normal;
	text-align: center;
	background-color: #fff;
	border-radius: 30px;
}
.officeTop .wide.linkBlock > .linkIllustration01,
.officeTop .wide.linkBlock > .linkIllustration02 {
	width: fit-content;
	position: absolute;
	margin: 0;
}
.officeTop .wide.linkBlock > .linkIllustration01 {
	top: -142px;
	left: -188px;
}
.officeTop .wide.linkBlock > .linkIllustration02 {
	right: -103px;
	bottom: 148px;
}
@media print, screen and (min-width: 768px) {
	.officeTop .linkBlock {
		max-width: 1840px;
	}
	.officeTop .linkBlock ul {
		justify-content: space-between;
	}
	.officeTop .linkBlock ul li {
		width: 30.702%;
	}
	.officeTop .linkBlock ul li a {
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
		height: 320px;
		padding: 0 20px;
	}
	.officeTop .linkBlock ul li a img {
		margin-bottom: 10px;
	}
}
/* ------------------------------
 下層ページリンク（SP）
------------------------------ */
@media screen and (max-width: 767px) {
	.officeTop .linkBlock {
		width: 90%;
		border-radius: 0 0 20px 20px;
		padding: 90px 0 40px;
		margin: 65px auto 50px;
	}
	.officeTop .wide.linkBlock > .linkIllustration01 {
		top: -85px;
		left: -102px;
		width: 500px;
		height: 141px;
	}
	.officeTop .linkBlock ul {
		gap: 15px 0;
	}
	.officeTop .linkBlock ul > li {
		width: 100%;
	}
	.officeTop .linkBlock ul > li a {
		text-align: left;
		border-radius: 20px;
		padding: 20px 6%;
	}
	.officeTop .linkBlock ul > li a div {
		display: flex;
		align-items: center;
		gap: 10px;
		margin-bottom: 5px;
	}
	.officeTop .linkBlock ul > li a div img {
		width: 80px;
		height: 60px;
		object-fit: cover;
		object-position: right;
	}
	.officeTop .wide.linkBlock > .linkIllustration02 {
		display: none;
	}
}

/* ------------------------------
 お知らせ（PC）
------------------------------ */
.newsBlock {
	position: relative;
}
.newsBlock .cms_link {
	position: absolute;
	top: 0;
	right: 0;
}
@media print, screen and (min-width: 768px) {
	.newsBlock {
		align-items: flex-start;
		justify-content: space-between;
		padding-top: 45px;
	}
	.newsBlock .newsList {
		width: 880px;
	}
}
/* ------------------------------
 下層ページリンク（SP）
------------------------------ */
@media screen and (max-width: 767px) {
	.newsBlock {
		justify-content: center;
		padding-bottom: 45px;
	}
	.newsBlock .cms_link {
		top: auto;
		bottom: 0;
	}
}

/* ------------------------------
 採用情報（PC）
------------------------------ */
.recruitBlock {
	position: relative;
	z-index: 1;
}
.recruitBlock a {
	display: block;
	border-radius: 30px;
}
.recruitBlock .cms_image:not(:first-child) img {
	border-radius: 30px;
}
.recruitBlock .cms_text {
	position: absolute;
	width: 300px;
	height: fit-content;
	font-size: 2.0rem;
	font-weight: 600;
	top: 0;
	margin: auto !important;
	pointer-events: none;
	z-index: 1;
	transition: .3s ease-in-out;
}
@media print, screen and (min-width: 768px) {
	.recruitBlock .cms_text {
		right: 86px;
		bottom: 0;
	}
	.recruitBlock .cms_image:has(a:hover) ~ .cms_text {
		opacity: .7;
	}
}
/* ------------------------------
 下層ページリンク（SP）
------------------------------ */
@media screen and (max-width: 767px) {
	.recruitBlock .sp:first-child {
        position: absolute;
        top: 0;
        left: 0;
		pointer-events: none;
    }
	.recruitBlock .cms_text {
		width: 100%;
		font-size: 1.8rem;
		text-align: center;
		padding-top: 50px;
	}
	.recruitBlock .cms_image:not(:first-child) img {
		border-radius: 20px;
	}
}