@charset "utf-8";

/* ------------------------------
 メイン（PC）
------------------------------ */
.mainBlock {
	position: relative;
	margin-bottom: 90px;
	background-color: #f1f6f8;
}
/* メインテキスト */
.mainText {
	font-size: 4.6rem;
	font-weight: 600;
	color: var(--fuyo-color);
	text-align: center;
	line-height: 1.5;
	padding: 50px 0 150px;
	position: relative;
	z-index: 1;
}
/* メインイメージ */
.mainimgBox {
	position: relative;
	z-index: 2;
	padding-bottom: 90px;
}
.mainimgBox::before {
	content: "";
	position: absolute;
	width: 100%;
	height: 85%;
	background-color: #deeaef;
	z-index: -1;
	left: 0;
	right: 0;
	bottom: 0;
	margin: auto;
}
.serviceBlock {
	display: flex;
	position: relative;
	z-index: 2;
	margin-top: -90px;
}
.serviceBox a {
	display: block;
	width: 100%;
	height: 100%;
	background-color: #fff;
	border: solid 6px #fff;
	border-radius: 30px;
	overflow: hidden;
	position: relative;
	line-height: 1.5;
}
.serviceBox .imgBox {
	position: relative;
	width: 100%;
}
.serviceBox .imgBox::after {
	content: "";
	background: url(../../img/service_illustration.png) no-repeat center / cover;
	position: absolute;
	right: 0;
	bottom: -1px;
	z-index: 1;
    width: 52.330%;
    height: auto;
    aspect-ratio: 292 / 56;
}
.serviceBox .imgBox img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.serviceBox .imgBox .serviceIcon {
	display: flex;
	flex-direction: column;
    justify-content: center;
    align-items: center;
	font-weight: 600;
	color: #fff;
	line-height: 1;
    text-align: center;
	border-radius: 50%;
	position: absolute;
	z-index: 2;
}
.serviceBox .imgBox .serviceIcon span {
	display: block;
}
.serviceBox.hospital .imgBox .serviceIcon {
	background-color: var(--hospital-blue);
}
.serviceBox.health .imgBox .serviceIcon {
	background-color: var(--health-green);
}
.serviceBox.care .imgBox .serviceIcon {
	background-color: var(--care-red);
}
.contentsHome .serviceBox.hospital h3::before {
	background-color: var(--hospital-color);
}
.contentsHome .serviceBox.health h3::before {
	background-color: var(--health-color);
}
.contentsHome .serviceBox.care h3::before {
	background-color: var(--care-color);
}
.mainIllustration,
.hospitalIllustration,
.healthIllustration,
.careIllustration {
	position: absolute;
	z-index: 1;
}
.mainIllustration {
	z-index: -1;
}
@media print, screen and (min-width: 768px) {
	.mainBlock {
		width: 100%;
		max-width: 1920px;
		margin-left: auto;
		margin-right: auto;
	}
	/* メインテキスト */
	.mainText {
		font-size: 4.6rem;
		line-height: 1.5;
		padding: 50px 0 150px;
		pointer-events: none;
	}
	/* メインイラスト */
	.mainIllustration {
		left: 0;
		right: 0;
		bottom: -25px;
		margin: auto;
	}
	/* メインイメージ */
	.mainimgBox {
		padding-bottom: 90px;
	}
	.mainimgBox::before {
		content: "";
		position: absolute;
		width: 100%;
		height: 85%;
		background-color: #deeaef;
		z-index: -1;
		left: 0;
		right: 0;
		bottom: 0;
		margin: auto;
	}
	.serviceBlock {
		width: 96%;
		max-width: 1800px;
		margin-left: auto;
		margin-right: auto;
		justify-content: center;
		gap: 0 1.4%;
	}
	.serviceBox {
		display: flex;
		width: 32.4%;
		container-type: inline-size;	/* 親要素に合わせてフォントサイズ変更 */
	}
	.serviceBox a {
		display: flex;
		flex-direction: column;
		flex-grow: 1;
        font-size: clamp(1.4rem, 2.80701cqw, 1.6rem);	/* 親要素に合わせてフォントサイズ変更 */
	}
	.serviceBox a .inBox {
		display: flex;
		flex-direction: column;
		flex-grow: 1;
		justify-content: flex-end;
		padding: 50px 4% 28px;
	}
	.serviceBox .imgBox {
		aspect-ratio: 558 / 382;
	}
	.serviceBox .imgBox::after {
        width: 52.330%;
        height: auto;
        aspect-ratio: 292 / 56;
	}
	.serviceBox .imgBox .serviceIcon {
		width: 20.61%;
        height: auto;
		aspect-ratio: 1 / 1;
		left: 20px;
		bottom: -36px;
		font-size: clamp(1.4rem, 2.98245cqw, 1.7rem);	/* 親要素に合わせてフォントサイズ変更 */
	}
	.serviceBox .imgBox .serviceIcon span {
		font-size: clamp(2.0rem, 5.08772cqw, 2.9rem);	/* 親要素に合わせてフォントサイズ変更 */
	}
	/* h3 */
	.contentsHome .serviceBox h3 {
		font-size: clamp(2.3rem, 5.78947cqw, 3.3rem);	/* 親要素に合わせてフォントサイズ変更 */
	}
	.contentsHome .serviceBox.care h3 {
		font-size: clamp(1.7rem, 4.03508cqw, 2.3rem);	/* 親要素に合わせてフォントサイズ変更 */
	}
	.hospitalIllustration {
		width: 32.259%;
		height: auto;
		right: 5%;
		bottom: 30px;
	}
	.healthIllustration {
		width: 34.051%;
		height: auto;
		right: 5px;
		bottom: 15px;
	}
	.careIllustration {
		width: 25.807%;
		height: auto;
		right: 5%;
		bottom: 15px;
	}
}
/* メインイラストの位置 */
@media print, screen and (min-width: 1420px) {
	/* メインイラスト */
	.mainIllustration {
		bottom: -45px;
	}
	.serviceBlock {
		width: 93.75%;
		gap: 0 2.4995%;
	}
	.serviceBox {
		width: 31.667%;
	}
	.serviceBox a .inBox {
		padding: 50px 28px 28px;
	}
	.hospitalIllustration {
		right: 36px;
	}
	.healthIllustration {
		right: 15px;
		bottom: 20px;
	}
	.careIllustration {
		right: 24px;
	}
}
@media print, screen and (min-width: 1680px) {
	/* メインイラスト */
	.mainIllustration {
		bottom: -90px;
	}
}
/* サービスブロック幅 */
@media print, screen and (min-width: 1920px) {
	.serviceBlock {
		width: 1800px;
	}
	.serviceBox {
		width: 570px;
	}
}
/* ------------------------------
 メイン（SP）
------------------------------ */
@media screen and (max-width: 767px) {
	.mainBlock {
		margin-bottom: 50px;
	}
	/* メインテキスト */
	.mainText {
		font-size: 3.0rem;
		line-height: 1.4;
		padding: 30px 0 145px;
	}
	/* メインイラスト */
	.mainimgBox {
		padding-bottom: 65px;
	}
	.mainIllustration img {
		width: 100%;
	}
	/* メインイメージ */
	.mainimgBox::before {
		height: 95%;
	}
	.serviceBlock {
		flex-direction: column;
		width: 89.334%;
		margin-left: 5.333%;
		margin-right: 5.333%;
		gap: 13px;
		margin-top: -70px;
	}
	.serviceBox a {
		border: solid 3px #fff;
		border-radius: 15px;
	}
	.contentsHome .serviceBox.care h3 {
		font-size: 1.6rem;
	}
	.serviceBox a .inBox {
		font-size: 1.3rem;
		padding: 34px 5% 20px;
	}
	.serviceBox .imgBox::after {
        width: 50.155%;
        height: auto;
	}
	.serviceBox .imgBox .serviceIcon {
		width: 21.28%;
        height: auto;
		aspect-ratio: 1 / 1;
		left: 3%;
		bottom: -20px;
		font-size: 1.0rem;
	}
	.serviceBox .imgBox .serviceIcon span {
		font-size: 1.8rem;
		margin-bottom: 2px;
	}
	.hospitalIllustration {
		width: 28.575%;
		height: auto;
		right: 5%;
		bottom: 18px;
	}
	.healthIllustration {
		width: 31.005%;
		height: auto;
		right: 3%;
		bottom: 23px;
	}
	.careIllustration {
		width: 23.284%;
		height: auto;
		right: 5%;
		bottom: 20px;
	}
}
@media screen and (max-width: 375px) {
}

/* ------------------------------
 見出し・共通（PC）
------------------------------ */
/* h2 */
.contentsHome h2 {
	position: relative;
	margin-bottom: 45px;
	font-size: 4.7rem;
	line-height: 1;
	font-weight: 600;
	text-align: center;
}
.contentsHome 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;
}
.contentsHome .newsBlock h2 {
	margin-bottom: 20px;
	color: var(--fuyo-color);
	font-family: "Rubik", sans-serif;
	font-weight: 500;
    text-align: left;
	letter-spacing: .03em;
}
/* h3 */
.contentsHome h3 {
	position: relative;
	font-size: 3.3rem;
	font-weight: 600;
	line-height: 1.2;
	padding-left: 20px;
	margin-bottom: 10px;
}
.contentsHome h3::before {
	content: "";
	width: 7px;
	height: 95%;
	border-radius: 3px;
	position: absolute;
	left: 0;
	top: 0;
	bottom: 5px;
	margin: auto;
}
/* ------------------------------
 見出し・テキスト（SP）
------------------------------ */
@media screen and (max-width: 767px) {
	/* h2 */
	.contentsHome h2 {
		font-size: 3.6rem;
		margin-bottom: 40px;
	}
	.contentsHome h2 span {
		font-size: 1.4rem;
	}
	.contentsHome h2::after {
		width: 62px;
		height: 10px;
	}
	/* h3 */
	.contentsHome h3 {
		font-size: 2.2rem;
		padding-left: 13px;
		margin-bottom: 5px;
	}
	.contentsHome h3::before {
		width: 5px;
	}
}

/* ------------------------------
 お知らせ・ブログ（PC）
------------------------------ */
/* お知らせ */
.newsBlock {
	position: relative;
	margin-bottom: 90px;
}
.newsIllustration {
	position: absolute;
	z-index: 2;
}
@media print, screen and (min-width: 768px) {
	.newsBlock {
		max-width: 1920px;
		margin-left: auto;
		margin-right: auto;
	}
	.newsBlock .inBlock {
		position: relative;
	}
	.newsBlock .cms_link.list {
		position: absolute;
		right: 0;
		top: 10px;
	}
	.newsIllustration {
		top: -155px;
		left: -70px;
	}
}
@media print, screen and (min-width: 1420px) {
	.newsIllustration {
		top: -27px;
	}
}
/* ------------------------------
 お知らせ・ブログ（SP）
------------------------------ */
@media screen and (max-width: 767px) {
	.newsBlock {
		margin-bottom: 40px;
	}
	.newsBlock .cms_link.list {
		text-align: right;
	}
	.newsBlock .newsList {
		margin-bottom: 15px;
	}
	.newsIllustration {
        top: -90px;
        left: -35px;
	}
	.newsIllustration img {
        width: 106px;
        height: auto;
	}
}

/* ------------------------------
 芙蓉協会について（PC）
------------------------------ */
.aboutBlock {
	position: relative;
	margin-bottom: 90px;
}
.contentsHome .aboutBlock h2 {
	color: #fff;
	font-size: 4.2rem;
	text-align: left;
	margin-bottom: 20px;
}
.contentsHome .aboutBlock h2 span {
	color: #fff;
}
.aboutBlock .inBox {
	color: #fff;
	background-color: var(--fuyo-color);
	padding: 60px;
}
.aboutBlock .inBox .btn {
	margin-top: 15px;
}
.aboutBlock .inBox .btn a {
	background-color: #fff;
}
/* イラスト */
.aboutIllustration {
	position: absolute;
	z-index: 2;
}
@media print, screen and (min-width: 768px) {
	.aboutBlock .flexBox img {
		width: calc(100% / 2);
		max-width: 570px;
		border-radius: 30px 0 0 30px;
		object-fit: cover;
	}
	.aboutBlock .inBox {
		display: flex;
		flex-direction: column;
		justify-content: center;
		width: calc(100% / 2);
		max-width: 570px;
		border-radius: 0 30px 30px 0;
	}
	.aboutIllustration {
		top: -70px;
		right: -66px;
	}
}
@media print, screen and (min-width: 1420px) {
	.aboutIllustration {
		top: 15px;
	}
}
/* ------------------------------
 芙蓉協会について（SP）
------------------------------ */
@media screen and (max-width: 767px) {
	.contentsHome .aboutBlock h2 {
		font-size: 3.0rem;
		margin-bottom: 25px;
	}
	.aboutBlock .flexBox img {
		border-radius: 15px 15px 0 0;
		object-fit: cover;
	}
	.aboutBlock .inBox {
		width: 100%;
		padding: 40px 5% 50px;
		border-radius: 0 0 15px 15px;
	}
	.aboutIllustration {
        bottom: -54px;
        right: -31px;
	}
	.aboutIllustration img {
		width: 111px;
		height: auto;
	}
}

/* ------------------------------
 採用情報（PC）
------------------------------ */
.recruitBlock {
	position: relative;
	margin-bottom: 90px;
}
.contentsHome .recruitBlock h2 {
	margin-bottom: 65px;
	padding-bottom: 35px;
	font-family: "Rubik", sans-serif;
	font-size: 6rem;
	font-weight: 500;
	text-align: left;
}
.contentsHome .recruitBlock h2 span {
	font-family: "IBM Plex Sans JP", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	font-size: 2rem;
	font-weight: 600;
}
.contentsHome .recruitBlock h2::after {
	margin: 0;
}
.recruitBlock .lead {
	font-size: 5.4rem;
	font-weight: 600;
	line-height: 1.45;
	margin-bottom: 20px;
}
@media print, screen and (min-width: 768px) {
	.recruitBlock {
		width: 95.8%;
		max-width: 1840px;
		height: 780px;
		margin-left: auto;
		margin-right: auto;
	}
	.recruitBlock .inBlock {
		display: flex;
		flex-direction: column;
		justify-content: center;
		position: absolute;
		top: 0;
		left: 50%;
		z-index: 2;
		height: 100%;
		margin-left: -570px;
		padding-left: 760px;
	}
	.recruitBlock .pc {
		position: relative;
		top: 0;
		left: 0;
		border-radius: 40px;
		height: 773px;
		object-fit: cover;
	}
}
/* ------------------------------
 採用情報（SP）
------------------------------ */
@media screen and (max-width: 767px) {
	.recruitBlock {
		width: 90%;
		margin: 0 5% 60px;
		border-radius: 20px;
		background-color: #edfafe;
	}
	.recruitBlock .sp:first-child {
		position: absolute;
		top: 0;
		left: 0;
		border-radius: 20px 20px 0 0;
	}
	.recruitBlock .inBlock {
		position: relative;
		z-index: 2;
		width: 88%;
		margin-left: 6%;
		margin-right: 6%;
		padding-top: 60px;
	}
	.contentsHome .recruitBlock h2 {
		margin-bottom: 40px;
		padding-bottom: 25px;
		font-size: 4.5rem;
	}
	.contentsHome .recruitBlock h2 span {
		margin-bottom: 10px;
		font-size: 1.5rem;
	}
	.recruitBlock .lead {
		font-size: 3.6rem;
		margin-bottom: 15px;
	}
	.recruitBlock .sp:last-child {
		margin-top: -150px;
		border-radius: 0 0 20px 20px;
	}
}

/* ------------------------------
 バナー（PC）
------------------------------ */
/* バナーリンク */
.bnrBlock .bnrLink {
	margin-bottom: 37px;
}
.bnrLink a {
	display: flex;
	align-items: center;
	column-gap: 15px;
	height: 170px;
	padding: 0 35px;
	border-radius: 20px;
	background-color: var(--base-color);
}
.bnrLink a p {
	display: flex;
	flex-direction: column;
	row-gap: 10px;
	line-height: 1.5;
}
.bnrLink a p strong {
	display: inline-block;
	font-size: 2rem;
	line-height: 30px;
	font-weight: 600;
}
.bnrLink a p strong::after {
	content: "";
	display: inline-block;
	width: 30px;
	height: 30px;
	margin: -6px 0 0 6px;
	background: url(../img/icon_blank_c_s_hc.svg) no-repeat 0 0 / cover;
	vertical-align: middle;
}
.bnrLink a:last-child p strong::after {
	background: url(../img/icon_blank_c_s_ih.svg) no-repeat 0 0 / cover;
}
/* バナースライド */
.bnrBlock .bnrSwiper {
	overflow: hidden;
	position: relative;
	z-index: 3;
}
.bnrSwiper:not(.swiper-initialized) ul {
	display: flex;
	justify-content: center;
	column-gap: 45px;
}
.bnrSwiper ul li {
	width: 30.702%;
	height: 106px;
	border-radius: 15px;
}
.bnrSwiper ul li a {
	display: flex;
	align-items: center;
	overflow: hidden;
	position: relative;
	z-index: 1;
	width: 100%;
	height: 100%;
	border-radius: 15px;
}
.bnrSwiper ul li a:not(:has(figure)) {
	padding: 20px 60px 20px 25px;
	background-color: var(--base-color);
}
.bnrSwiper ul li a:not(:has(figure)) p {
	color: var(--main-font-color);
	font-size: 1.8rem;
	line-height: 1.4;
	font-weight: 600;
}
.bnrSwiper ul li a:not(:has(figure))::after {
	content: "";
	position: absolute;
	top: 0;
	bottom: 0;
	right: 20px;
	width: 38px;
	height: 38px;
	margin: auto 0;
	background: url(../img/icon_arrow_c_r.svg) no-repeat 0 0 / cover;
	transition: .3s ease-in-out;
}
.bnrSwiper ul li a[target="_blank"]:not(:has(figure))::after {
	background: url(../img/icon_blank_c.svg) no-repeat 0 0 / cover;
}
/* 5枚以上でスライド */
.bnrBlock .bnrSwiper.swiper-horizontal {
	padding-bottom: 53px;
}
/* ページネーション */
.bnrSwiper .swiper-pagination-bullets.swiper-pagination-horizontal {
	display: block;
	bottom: 0;
	left: 50%;
	width: calc(100% - 16px);
	height: 38px;
	padding-top: 4px;
	transform: translateX(-50%);
}
.bnrSwiper .swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet {
	opacity: 1;
	margin: 0 4px;
	background-color: #bfcfdb;
}
.bnrSwiper .swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet:first-child {
	margin-left: 0;
}
.bnrSwiper .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active {
	background-color: var(--fuyo-color);
}
/* 前へ／次へボタン */
.bnrSwiper .swiper-buttons {
	display: flex;
	justify-content: flex-end;
	gap: 7px;
	position: absolute;
	bottom: 0;
	right: 8px;
	height: 38px;
}
.bnrSwiper .swiper-buttons .swiper-button-prev,
.bnrSwiper .swiper-buttons .swiper-button-next {
	position: static;
	width: 38px;
	height: 38px;
	margin: 0;
	transition: .3s ease-in-out;
}
.bnrSwiper .swiper-buttons .swiper-button-prev::after,
.bnrSwiper .swiper-buttons .swiper-button-next::after {
	content: "";
	display: block;
	width: 38px;
	height: 38px;
	border-radius: 6px;
	background: #a3bacc url(../img/icon_arrow_r_w_s.svg) no-repeat 13px center / 13px 10px;
}
.bnrSwiper .swiper-buttons .swiper-button-prev::after {
	transform: rotate(180deg);
}
@media print, screen and (min-width: 768px) {
	/* バナーリンク */
	.bnrBlock .bnrLink {
		display: flex;
		justify-content: space-between;
	}
	/* 前へ／次へボタン */
	.bnrSwiper .swiper-buttons .swiper-button-prev:hover,
	.bnrSwiper .swiper-buttons .swiper-button-next:hover {
		opacity: .7;
	}
}
/* ------------------------------
 バナー（SP）
------------------------------ */
@media screen and (max-width: 767px) {
	/* バナーリンク */
	.bnrBlock .bnrLink {
		margin-bottom: 12px;
	}
	.bnrLink a {
		column-gap: 10px;
		height: 156px;
		padding: 0 15px 0 20px;
		border-radius: 15px;
	}
	.bnrLink a + a {
		margin-top: 12px;
	}
	.bnrLink a img {
		width: 80px;
	}
	.bnrLink a p strong {
		font-size: 1.8rem;
	}
	/* バナースライド */
	.bnrBlock .bnrSwiper:not(.swiper-horizontal) ul {
		flex-flow: row wrap;
		gap: 12px 0;
	}
	.bnrSwiper ul li {
		width: 100%;
		height: 80px;
	}
	.bnrSwiper ul li a:not(:has(figure)) {
		padding: 10px calc(5% + 40px) 10px 20px;
	}
	.bnrSwiper ul li a:not(:has(figure)) p {
		font-size: 1.6rem;
	}
	.bnrSwiper ul li a:not(:has(figure)) p br {
		display: none;
	}
	.bnrSwiper ul li a:not(:has(figure))::after {
		width: 30px;
		height: 30px;
	}
	/* 5枚以上でスライド */
	.bnrBlock .bnrSwiper.swiper-horizontal {
		padding-bottom: 46px;
	}
	/* ページネーション */
	.bnrSwiper .swiper-pagination-bullets.swiper-pagination-horizontal {
		height: 34px;
		padding-top: 4px;
	}
	.bnrSwiper .swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet {
		margin: 0 4px;
	}
	/* 前へ／次へボタン */
	.bnrSwiper .swiper-buttons {
		gap: 5px;
		height: 34px;
	}
	.bnrSwiper .swiper-buttons .swiper-button-prev,
	.bnrSwiper .swiper-buttons .swiper-button-next {
		width: 34px;
		height: 34px;
	}
	.bnrSwiper .swiper-buttons .swiper-button-prev::after,
	.bnrSwiper .swiper-buttons .swiper-button-next::after {
		width: 34px;
		height: 34px;
		border-radius: 5px;
		background: #a3bacc url(../img/icon_arrow_r_w_s.svg) no-repeat 11px center / 13px 10px;
	}
}