@charset "utf-8";

/* ------------------------------
 メイン（PC）
------------------------------ */
.mainBlock {
	position: relative;
	margin-bottom: 90px;
}
/* メインイメージ */
.mainBlock .mainimgSwiper {
	position: relative;
	width: 100%;
}
.mainBlock .swiper,
.mainBlock .swiper-slide,
.mainBlock .swiper-img {
	height: 100%;
}
.mainBlock .swiper-img img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}
/* メインテキスト */
.mainText {
	position: absolute;
	z-index: 2;
}
.mainText .pc {
	font-weight: 600;
	letter-spacing: .1em;
}
.mainText .pc span {
	display: inline-block;
	padding: 5px 15px 0 20px;
	border-radius: 8px;
	background-color: #fff;
}
/* ご予約・お問合せ */
.phoneBox {
	width: 336px;
    height: 170px;
	background-color: var(--health-green);
    border-bottom-right-radius: 30px;
    padding: 25px;
	position: absolute;
	top: 0;
	left: -2.2%;
	z-index: 10;
}
.phone {
	position: relative;
	color: #fff;
	font-size: 2.0rem;
	font-weight: 600;
	text-align: center;
}
.phone span {
	position: relative;
	display: inline-block;
	padding-bottom: 1px;
	border-bottom: solid 1px #80c3b1;
}
.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;
}
.phone::before,
.phone::after {
	content: "";
	position: absolute;
	width: 15px;
    height: 7px;
	background-color: #80c3b1;
	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(--health-green);
	bottom: -4px;
	z-index: 2;
}
.phoneBox > a {
	display: block;
	margin: 15px 0 0;
	font-family: "Rubik", sans-serif;
	font-size: 4.0rem;
	line-height: 1;
	font-weight: 500;
	text-align: center;
	color: #fff;
	letter-spacing: -0.02em;
}
.phoneBox > p {
	font-size: 1.5rem;
	letter-spacing: -0.05em;
	color: #fff;
}
.phoneBox > p span {
	font-weight: 600;
}
.mainIllustration01,
.mainIllustration02,
.mainIllustration03 {
	position: absolute;
	z-index: 2;
}
@media print, screen and (min-width: 768px) {
	.mainBlock {
		width: 95.8%;
		max-width: 1840px;
		margin-left: auto;
		margin-right: auto;
	}
	/* メインイメージ */
	.mainBlock .mainimgSwiper {
		height: 780px;
	}
	.mainBlock .swiper-img img {
		border-radius: 40px;
	}
	/* メインテキスト */
	.mainText {
		top: 545px;
		left: 62px;
	}
	.mainText .pc {
		font-size: 3.6rem;
		line-height: 1.5;
	}
	.mainText .pc span:first-child {
		margin-bottom: 15px;
	}
	/* メインイラスト */
	.mainIllustration01 {
		bottom: -24px;
		right: -2.2%;
	}
	.mainIllustration01 img {
		width: 650px;
	}
	.mainIllustration02 {
		bottom: 274px;
		left: -84px;
	}
	.mainIllustration03 {
		top: 74px;
		right: -87px;
	}
}
@media print, screen and (min-width: 1420px) {
	/* メインテキスト */
	.mainText .pc {
		font-size: 4.8rem;
	}
	.mainText .pc span:first-child {
		margin-bottom: 20px;
	}
	/* メインイラスト */
	.mainIllustration01 img {
		width: 650px;
	}
}
/* ------------------------------
 メイン（SP）
------------------------------ */
@media screen and (max-width: 767px) {
	.mainBlock {
		margin-bottom: 50px;
	}
	/* メインイメージ */
	.mainimgBox {
		position: relative;
		margin-bottom: 40px;
	}
	.mainBlock .mainimgSwiper {
		height: 627px;
	}
	.mainBlock .swiper-img img {
		object-position: center 0;
	}
	/* メインテキスト */
	.mainText {
		bottom: 25%;
		left: 5%;
	}
	.mainText .sp {
		font-size: 2.4rem;
		line-height: 1.25;
		font-weight: 600;
		letter-spacing: .08em;
	}
	.mainText .sp span {
		display: inline-block;
		padding: 4px 10px 0 10px;
		border-radius: 4px;
		background-color: #fff;
	}
	.mainText .sp span:not(:last-child) {
		margin-bottom: 10px;
	}
	.mainText .sp span:nth-of-type(2) {
		padding-right: 0;
	}
	/* メインメニュー */
	.phoneBox {
		width: 83%;
		height: auto;
		border-radius: 0 0 18px 0;
		padding: 10px 0 15px;
		left: 0;
	}
	.phone {
		font-size: 1.6rem;
	}
	.phone span {
		padding-bottom: 0;
	}
	.phone span::before {
		width: 20px;
		height: 20px;
		margin: -4px 6px 0 0;
	}
	.phoneBox > a {
		margin: 7px 0 0;
		font-size: 3.7rem;
	}
	.phoneBox > p {
		font-size: 1.4rem;
		text-align: center;
	}
	/* メインイラスト */
	.mainIllustration01 {
		bottom: -12px;
		right: 0;
	}
	.mainIllustration01 img {
		width: 325px;
	}
	.mainIllustration02 {
		bottom: 12px;
		right: -42px;
	}
	.mainIllustration02 img {
		width: 130px;
	}
}

/* ------------------------------
 見出し・共通（PC）
------------------------------ */
/* h2 */
.contentsHome h2 {
	position: relative;
	margin-bottom: 45px;
	padding-bottom: 30px;
	font-size: 4.7rem;
	line-height: 1;
	font-weight: 600;
}
.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 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;
}
.contentsHome .recruitBlock h2::after {
	background: url(../img/icon_title_recruit.png) no-repeat center / cover;
}
/* h3 */
.contentsHome h3 {
	position: relative;
	margin-bottom: 30px;
	padding-bottom: 25px;
	font-size: 3.6rem;
	line-height: 1;
	font-weight: 600;
	text-align: center;
}
.contentsHome h3::after {
	content: "";
	display: block;
	width: 62px;
	height: 8px;
	background: url(../img/h3_decoration_home.png) no-repeat 0 0 / cover;
	margin: auto;
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
}
.serviceBlock .btn a,
.recruitBlock .btn a {
	background-color: #fff;
}
/* ------------------------------
 見出し・テキスト（SP）
------------------------------ */
@media screen and (max-width: 767px) {
	/* h2 */
	.contentsHome h2 {
		font-size: 3.6rem;
		text-align: center;
		margin-bottom: 30px;
		padding-bottom: 25px;
	}
	.contentsHome h2 span {
		font-size: 1.4rem;
		margin-bottom: 12px;
	}
	.contentsHome h2::after {
		width: 62px;
		height: 9px;
		margin: auto;
	}
	/* h3 */
	.contentsHome h3 {
		margin-bottom: 20px;
		padding-bottom: 20px;
		font-size: 2.8rem;
	}
	.contentsHome h3::after {
		width: 52px;
		height: 6px;
		background: url(../img/h3_decoration_home_sp.png) no-repeat 0 0 / cover;
	}
	/* 共通 */
	.serviceBlock .inBlock {
		width: 88%;
		margin-left: 6%;
		margin-right: 6%;
	}
	.contentsHome .btn a {
		min-width: 230px;
	}
}

/* ------------------------------
 お知らせ・ブログ（PC）
------------------------------ */
/* ブログ */
.contentsHome .postList {
	display: flex;
}
@media print, screen and (min-width: 768px) {
	.contentsHome .postList {
		flex-flow: row wrap;
		gap: 20px 28px;
	}
	.contentsHome .postList li {
		width: calc((100% - 28px) / 2);
	}
}
/* ------------------------------
 お知らせ・ブログ（SP）
------------------------------ */
@media screen and (max-width: 767px) {
	/* ブログ */
	.contentsHome .postSwiper {
		position: relative;
		padding-bottom: 55px;
	}
	.contentsHome .postSwiper {
		padding-left: 15%;
		padding-right: 15%;
		margin-left: -5.5%;
		margin-right: -5.5%;
	}
	.contentsHome .postList {
		justify-content: space-between;
	}
	.contentsHome .postSwiper .swiper-buttons {
		right: auto;
		left: 5%;
	}
	/* ページネーション */
	.contentsHome .postSwiper .swiper-pagination-bullets.swiper-pagination-horizontal {
		height: 25px;
		left: calc(5% + 112px);
	}
}

/* ------------------------------
 お知らせ・ブログ（PC）
------------------------------ */
.newsBlock {
	position: relative;
	margin-bottom: 120px;
}
.newsBlock .inBlock .postBlock {
	position: relative;
}
.newsBlock .inBlock .postBlock .cms_link {
	position: absolute;
	top: 75px;
	right: 0;
}
@media print, screen and (min-width: 768px) {
	.newsBlock .inBlock {
		display: flex;
		justify-content: space-between;
	}
	.newsBlock .inBlock .postBlock {
		width: 536px;
	}
}
/* ------------------------------
 お知らせ・ブログ（SP）
------------------------------ */
@media screen and (max-width: 767px) {
	.newsBlock .inBlock .postBlock.news {
		padding-bottom: 45px;
		margin-bottom: 60px;
	}
	.newsBlock .inBlock .postBlock .cms_link {
		top: auto;
		bottom: -3px;
	}
}

/* ------------------------------
 当院の歴史と特長（PC）
------------------------------ */
.serviceBlock {
	position: relative;
	background-color: var(--base-color);
	padding: 110px 0 90px;
	margin-bottom: 90px;
}
.contentsHome .serviceBlock h2,
.contentsHome .aboutBlock h2 {
	font-size: 5.5rem;
}
.contentsHome .serviceBlock h2 {
	margin-bottom: 65px;
	text-align: center;
}
.contentsHome .serviceBlock h2::after {
	margin: auto;
}
.serviceBlock .serviceBox img {
	border-radius: 30px;
}
.serviceBlock .serviceBox .textBox {
	position: relative;
    padding: 0 55px;
    margin-top: 40px;
}
/* イラスト */
.serviceIllustration01 {
	position: absolute;
	z-index: 2;
	pointer-events: none;
}
@media print, screen and (min-width: 768px) {
	.serviceBlock {
        width: 95.8%;
        max-width: 1840px;
        margin-left: auto;
        margin-right: auto;
        border-radius: 40px;
    }
	.serviceBlock .flexBox {
		width: 95.7%;
		max-width: 1760px;
		margin: 0 auto;
		gap: 1.4195%;
	}
	.serviceBlock .serviceBox {
		width: 32.387%;
    }
	.serviceBlock .serviceBox:not(:last-child) .textBox::after {
		content: "";
		position: absolute;
		border-right: var(--dotline);
		right: -2.5%;
		top: 0;
		bottom: 0;
		margin: auto;
	}

	/* イラスト */
	.serviceIllustration01 {
		position: absolute;
		top: -168px;
		left: calc(-2.1% - 150px);
	}
	.serviceIllustration01 img {
		width: 800px;
	}
}
@media print, screen and (min-width: 1420px) {
	.serviceIllustration01 {
		top: -186px;
	}
	.serviceIllustration01 img {
		width: 884px;
	}
}
/* ------------------------------
 当院の歴史と特長（SP）
------------------------------ */
@media screen and (max-width: 767px) {
	.serviceBlock {
		width: 90%;
		margin: 0 5% 60px;
		padding: 60px 5% 35px;
		border-radius: 0 0 20px 20px;
	}
	.contentsHome .serviceBlock h2,
	.contentsHome .aboutBlock h2 {
        font-size: 3.8rem;
	}
	.contentsHome .serviceBlock h2 {
		line-height: 1.2;
		margin-bottom: 40px;
	}
	.contentsHome .serviceBlock .flexBox {
		gap: 35px 0;
	}
	.serviceBlock .serviceBox img {
		border-radius: 15px;
	}
	.serviceBlock .serviceBox .textBox {
		padding: 0 5%;
		margin-top: 30px;
	}
	.serviceIllustration01 {
		top: -93px;
		left: -95px;
	}
	.serviceIllustration01 img {
		max-width: initial;
		width: 442px;
	}
}

/* ------------------------------
 センターについて（PC）
------------------------------ */
.aboutBlock {
	position: relative;
	margin-bottom: 110px;
}
.aboutBlock .inBlock {
	position: relative;
}
.aboutBlock .inBlock p:not(.btn) {
    font-size: 1.8rem;
}
@media print, screen and (min-width: 768px) {
	.aboutBlock {
		height: 460px;
	}
	.aboutBlock .inBlock p:not(.btn) {
    	width: 530px;
		margin-bottom: 40px;
	}
	.aboutBlock .inBlock img {
		position: absolute;
		right: -75px;
		top: -53px;
	}
}
/* ------------------------------
 センターについて（SP）
------------------------------ */
@media screen and (max-width: 767px) {
	.aboutBlock .inBlock {
		width: 100%;
        margin-left: 0;
        margin-right: 0;
	}
	.contentsHome .aboutBlock h2,
	.aboutBlock .inBlock p {
        padding-left: 5%;
        padding-right: 5%;
	}
	.aboutBlock .inBlock p:not(.btn) {
    	font-size: 1.6rem;
		margin-bottom: 15px;
	}
	.aboutBlock .inBlock .btn {
		text-align: center;
    	margin-top: 30px;
	}
}

/* ------------------------------
 採用情報（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;
}
/* イラスト */
.recruitIllustration01 {
	position: absolute;
	z-index: 2;
	pointer-events: none;
}
@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;
	}
	/* イラスト */
	.recruitIllustration01 {
		top: -185px;
		right: calc(-2.1% - 180px);
	}
	.recruitIllustration01 img {
		width: 800px;
	}
}
@media print, screen and (min-width: 1420px) {
	.recruitIllustration01 {
		top: -195px;
		right: calc(-2.1% - 104px);
	}
	.recruitIllustration01 img {
		width: 846px;
	}
}
/* ------------------------------
 採用情報（SP）
------------------------------ */
@media screen and (max-width: 767px) {
	.recruitBlock {
		width: 90%;
		margin: 0 5% 60px;
		border-radius: 0 0 20px 20px;
		background-color: #edfafe;
	}
	.recruitBlock .recruitIllustration01 + .sp {
		position: absolute;
		top: 0;
		left: 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;
	}
	.recruitIllustration01 {
		top: -97px;
		right: -70px;
	}
	.recruitIllustration01 img {
		max-width: initial;
		width: 423px;
	}
}

/* ------------------------------
 バナー（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_hospital.svg) no-repeat 0 0 / cover;
	vertical-align: middle;
}
.bnrLink a:last-child p strong::after {
	background: url(../img/icon_blank_c_s_care.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: 36px;
}
.bnrSwiper ul li {
	width: 22.632%;
	height: 104px;
	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(--health-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;
	}
}