/* =============================================
    TOPページ用CSS
    ============================================= */

/* ---------------------------------------------
    1. ベーススタイル
    --------------------------------------------- */
html {
	font-size: 62.5%;
}
body {
	font-family: 'Zen Old Mincho', serif;
}

section {
	padding: 90px 0 0;
	margin-bottom: unset;
}
@media (width >= 769px) {
	section {
		padding: 155px 0 0;
	}
}

a,
button {
	cursor: pointer;
	&:hover {
		opacity: 0.8;
		transition: opacity 0.3s;
	}
}

/* ---------------------------------------------
    2. ユーティリティクラス
    --------------------------------------------- */
.pc-none {
	display: block;
}
@media (width >= 769px) {
	.pc-none {
		display: none;
	}
}

.sp-none {
	display: none;
}
@media (width >= 769px) {
	.sp-none {
		display: block;
	}
	.TopTtl .subTitl {
		margin-bottom: 25px;
	}
}

.flex {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: flex-start;
}

/* ---------------------------------------------
    3. 共通コンポーネント
    --------------------------------------------- */
.PageTtl {
	margin-bottom: 30px;
	h2 {
		font-size: 2rem;
		font-weight: 400;
		line-height: 1.5;
		letter-spacing: 0.05em;
		text-align: center;
	}
	h3 {
		font-size: 2rem;
		font-weight: 400;
		line-height: 1.5;
		letter-spacing: 0.05em;
		text-align: center;
	}
}
/* MD: 769px */
@media (width >= 769px) {
	.PageTtl {
		h2 {
			font-size: 3rem;
		}
		h3 {
			font-size: 3rem;
		}
	}
}

/* ボタンエリア */
.BtnArea {
	margin-top: 50px;
	text-align: center;
	.btn {
		font-size: 1.5rem;
		color: #000;
		border: unset;
		padding: 0 0 10px 0;
		text-decoration: none;
		display: inline-block;
		letter-spacing: 0.1em;
		transition: all 0.3s ease;
		border-bottom: solid 2px #333;
		background: transparent;
	}
	.btn:hover {
		background: transparent;
		border-bottom-color: #333;
	}
}

.hospitalment-about {
	margin-top: 60px;
}
@media (width >= 769px) {
	.hospitalment-about {
		margin-top: 90px;
	}
}

.hospitalmentAbout_Concept {
	.hospitalmentAbout_Concept_Inner {
		width: 90%;
		max-width: 1230px;
		margin: 0 auto;
	}
	h1 {
		font-size: 2rem;
		font-weight: 400;
		line-height: 2;
		letter-spacing: 0.05em;
		text-align: center;
		margin-bottom: 30px;
	}
	.hospitalmentAbout_Concept_Box {
		justify-content: space-between;
	}
	.hospitalmentAbout_Concept_Box_Left {
		width: 100%;
	}
	.hospitalmentAbout_Concept_Txt {
		p {
			font-size: 1.5rem;
			line-height: 2;
		}
	}
}
/* MD: 769px */
@media (width >= 769px) {
	.hospitalmentAbout_Concept {
		h1 {
			margin-bottom: 40px;
			font-size: 3rem;
			text-align: left;
		}
		.hospitalmentAbout_Concept_Box_Left {
			width: 53%;
		}
		.hospitalmentAbout_Concept_Box_Right {
			width: 38%;
		}
	}
}

.Reason {
	.ReasonInner {
		width: 90%;
		max-width: 1170px;
		margin: 0 auto;
	}
	.ReasonInner_Txt {
		margin-bottom: 70px;
		p {
			font-size: 1.5rem;
			line-height: 2;
			text-align: center;
		}
	}
	/* MD: 769px */
	@media (width >= 769px) {
		.ReasonInner_Txt {
			margin-bottom: 130px;
		}
	}
	.ReasonInner_Box {
		justify-content: space-evenly;
		margin-bottom: 40px;
		gap: 40px 10px;
		li {
			width: 48%;
		}
	}
	/* MD: 769px */
	@media (width >= 769px) {
		.ReasonInner_Box {
			margin-bottom: 160px;
			li {
				width: 15%;
			}
		}
	}
	.ReasonInner_Box_img {
		margin-bottom: 20px;
	}
	.ReasonInner_Box_item {
		span {
			text-align: center;
			font-size: 1.5rem;
			line-height: 2;
			display: block;
			margin-bottom: 10px;
		}
		h3 {
			font-size: 1.5rem;
			text-align: center;
			line-height: 2;
		}
	}

	/* MD: 769px */
	@media (width >= 769px) {
		.ReasonInner_Box_item {
			span {
				font-size: 2rem;
			}
		}
	}
	.ReasonInnerBg {
		background: #fbfbfb;
		width: 100vw;
		margin-left: calc(-50vw + 50%);
		padding-left: calc(50vw - 50%);
		padding-right: calc(50vw - 50%);
		padding-top: 80px;
		padding-bottom: 80px;
	}
	/* MD: 769px */
	@media (width >= 769px) {
		.ReasonInnerBg {
			margin-bottom: 120px;
		}
	}

	.ReasonInner_Box02 {
		margin-bottom: 80px;
		li {
			.num {
				text-align: center;
				font-size: 2rem;
				display: block;
				margin-bottom: 20px;
			}
			h3 {
				font-size: 3rem;
				text-align: left;
				line-height: 2;
				margin-bottom: 20px;
			}
			p {
				font-size: 1.5rem;
				text-align: left;
				line-height: 2;
				margin-bottom: 60px;
			}
		}
		/* MD: 769px */
		@media (width >= 769px) {
			.ReasonInner_Box02 {
				margin-bottom: 160px;
			}
			li {
				width: 70%;
				margin: 0 auto;
				.num {
					font-size: 4rem;
					margin-bottom: 30px;
				}
				h3 {
					font-size: 3rem;
					text-align: center;
					margin-bottom: 30px;
				}
				p {
					margin-bottom: 120px;
				}
			}
		}
	}
	.ReasonInner_Box03 {
		.ReasonInner_Box03_Left {
			width: 100%;
			h3 {
				font-size: 3rem;
				text-align: left;
				line-height: 2;
				margin-bottom: 20px;
			}
			p {
				font-size: 1.5rem;
				text-align: left;
				line-height: 2;
				margin-bottom: 60px;
			}
		}
		.ReasonInner_Box03_Right {
			width: 100%;
		}
	}
	/* MD: 769px */
	@media (width >= 769px) {
		.ReasonInner_Box03 {
			gap: 0 80px;
			.ReasonInner_Box03_Left {
				width: 50%;
			}
			.ReasonInner_Box03_Right {
				width: 40%;
			}
		}
	}
	.ReasonInner_Box04 {
		margin-bottom: 80px;
		li {
			.num {
				text-align: center;
				font-size: 2rem;
				display: block;
				margin-bottom: 20px;
			}
			h3 {
				font-size: 3rem;
				text-align: left;
				line-height: 2;
				margin-bottom: 20px;
			}
			p {
				font-size: 1.5rem;
				text-align: left;
				line-height: 2;
				margin-bottom: 60px;
			}
		}
		.ReasonInner_Box04_list {
			li {
				width: 100%;
				picture {
					display: block;
					margin-bottom: 40px;
				}
				h4 {
					font-size: 2rem;
					text-align: center;
					margin-bottom: 20px;
				}
				p {
					font-size: 1.5rem;
					text-align: left;
					line-height: 2;
					margin-bottom: 60px;
				}
			}
		}
		/* MD: 769px */
		@media (width >= 769px) {
			.ReasonInner_Box04 {
				margin-bottom: 160px;
			}
			li {
				width: 70%;
				margin: 0 auto;
				.num {
					font-size: 4rem;
					margin-bottom: 30px;
				}
				h3 {
					font-size: 3rem;
					text-align: center;
					margin-bottom: 30px;
				}
				p {
					margin-bottom: 120px;
				}
			}
			.ReasonInner_Box04_list {
				gap: 0 30px;
				align-items: start;
				li {
					width: 46%;
				}
			}
		}
	}
	.ReasonInner_Box05 {
		margin-bottom: 80px;
		li {
			.num {
				text-align: center;
				font-size: 2rem;
				display: block;
				margin-bottom: 20px;
			}
			h3 {
				font-size: 3rem;
				text-align: left;
				line-height: 2;
				margin-bottom: 20px;
			}
			p {
				font-size: 1.5rem;
				text-align: left;
				line-height: 2;
				margin-bottom: 60px;
			}
		}
		/* Box05Swiper スタイル */
		.Box05Swiper {
			width: 100vw;
			margin-left: calc(-50vw + 50%);
			padding: 0;
			overflow: hidden;
			position: relative;
			margin-bottom: 80px;
			.swiper-slide {
				picture {
					display: block;
					margin-bottom: 20px;
					img {
						width: 100%;
						height: auto;
						display: block;
					}
				}
				h4 {
					font-size: 1.8rem;
					line-height: 1.8;
					margin-bottom: 15px;
					padding: 0 5%;
				}
				> p {
					font-size: 1.4rem;
					line-height: 2;
					margin-bottom: 20px;
					padding: 0 5%;
				}
				.swiperBg {
					background: #f5f4f2;
					padding: 20px 5%;
					h5 {
						font-size: 1.4rem;
						margin-bottom: 10px;
						line-height: 1.8;
					}
					p {
						font-size: 1.2rem;
						line-height: 2;
						margin-bottom: 0;
					}
				}
			}
		}

		/* Box05Swiper ナビゲーション */
		.Box05Swiper-nav {
			display: flex;
			align-items: center;
			justify-content: center;
			gap: 20px;
			margin-top: 40px;
			padding: 0 5%;
		}
		.Box05Swiper-prev,
		.Box05Swiper-next {
			cursor: pointer;
			display: flex;
			align-items: center;
			gap: 10px;
			font-size: 1.4rem;
			color: #999;
			letter-spacing: 0.1em;
			transition: color 0.3s;
			&:hover {
				color: #333;
			}
		}
		.Box05Swiper-prev::before {
			content: '';
			display: block;
			width: 40px;
			height: 1px;
			background: #999;
		}
		.Box05Swiper-next::after {
			content: '';
			display: block;
			width: 40px;
			height: 1px;
			background: #999;
		}
		.Box05Swiper-pagination {
			display: flex;
			align-items: center;
			gap: 8px;
			position: static !important;
			width: auto !important;
		}
		.Box05Swiper-pagination .swiper-pagination-bullet {
			width: 8px;
			height: 8px;
			background: #ccc;
			opacity: 1;
			margin: 0 !important;
		}
		.Box05Swiper-pagination .swiper-pagination-bullet-active {
			background: #333;
		}

		.Profession {
			margin-bottom: 80px;
			.ProfessionList {
				justify-content: space-between;
				gap: 40px 0;
				li {
					width: 48%;
					h4 {
						font-size: 1.5rem;
						text-align: center;
						margin-top: 20px;
					}
				}
			}
		}

		/* MD: 769px */
		@media (width >= 769px) {
			.Profession {
				justify-content: start;
				margin-bottom: 120px;
				.ProfessionList {
					li {
						width: 17%;
					}
				}
			}
		}

		.Eat {
			.EatText {
				p {
					font-size: 1.5rem;
					text-align: center;
					line-height: 2;
					margin-bottom: 60px;
				}
			}
			.EatInnerBox {
				margin-bottom: 80px;
				.EatInnerBoxItem {
					width: 100%;
					picture {
						display: block;
						margin-bottom: 20px;
					}
					h4 {
						font-size: 1.5rem;
						text-align: center;
						margin-top: 20px;
						line-height: 1.8;
					}
				}
			}
		}
		.Bnr {
			margin-bottom: 80px;
			picture {
				margin: 0 auto;
				display: block;
				width: 100%;
			}
		}
		.Service {
			background: #fbfbfb;
			width: 100vw;
			margin-left: calc(-50vw + 50%);
			padding-left: calc(50vw - 50%);
			padding-right: calc(50vw - 50%);
			padding-top: 80px;
			padding-bottom: 80px;
			.ServiceInnerBox {
				margin-bottom: 80px;
			}
			.ServiceRight {
				width: 100%;
				p {
					font-size: 1.5rem;
					text-align: left;
					line-height: 2;
				}
			}
			.ServiceLeft {
				width: 100%;
			}
			.Bnr {
				picture {
					margin: 0 auto;
					display: block;
					width: 100%;
				}
			}
		}

		/* MD: 769px */
		@media (width >= 769px) {
			.Eat {
				.EatInnerBox {
					margin-bottom: 120px;
					justify-content: space-between;
					.EatInnerBoxItem {
						width: 30%;
					}
				}
				.Bnr {
					picture {
						width: 78%;
					}
				}
			}

			.Service {
				padding-top: 120px;
				padding-bottom: 120px;
				.ServiceInnerBox {
					margin-bottom: 120px;
					gap: 0 40px;
				}
				.ServiceRight {
					width: 43%;
					p {
						font-size: 1.5rem;
						text-align: left;
						line-height: 2;
					}
				}
				.ServiceLeft {
					width: 50%;
				}
				.Bnr {
					/* margin-bottom: 210px; */
					picture {
						width: 70%;
					}
				}
			}

			.ReasonInner_Box05 {
				margin-bottom: 160px;
			}
			li {
				width: 70%;
				margin: 0 auto;
				.num {
					font-size: 4rem;
					margin-bottom: 30px;
				}
				h3 {
					font-size: 3rem;
					text-align: center;
					margin-bottom: 30px;
				}
				p {
					margin-bottom: 120px;
				}
			}

			.Box05Swiper {
				/* width: 90%;
          max-width: 1170px;
          margin-left: auto;
          margin-right: auto;
          overflow: visible; */
				margin-bottom: 120px;
				.swiper-slide {
					transition:
						opacity 0.4s ease,
						transform 0.4s ease;
					opacity: 0.5;
					transform: scale(0.9);
				}
				.swiper-slide-active {
					opacity: 1;
					transform: scale(1);
				}

				.swiper-slide {
					h4 {
						font-size: 2rem;
						padding: 0;
					}
					> p {
						font-size: 1.5rem;
						padding: 0;
					}
					.swiperBg {
						padding: 25px 30px;
						h5 {
							font-size: 1.5rem;
						}
						p {
							font-size: 1.3rem;
						}
					}
				}
			}

			.Box05Swiper-nav {
				gap: 30px;
				padding: 0;
			}
			.Box05Swiper-prev::before,
			.Box05Swiper-next::after {
				width: 60px;
			}
		}
	}
	.ReasonInner_Box06 {
		li {
			.num {
				text-align: center;
				font-size: 2rem;
				display: block;
				margin-bottom: 20px;
			}
			h3 {
				font-size: 3rem;
				text-align: left;
				line-height: 2;
				margin-bottom: 20px;
			}
			p {
				font-size: 1.5rem;
				text-align: left;
				line-height: 2;
				margin-bottom: 60px;
			}
		}

		.ReasonInner_Box06_Service {
			margin-bottom: 60px;
			h4 {
				font-size: 2rem;
				text-align: center;
				line-height: 2;
				margin-bottom: 20px;
			}
		}

		/* MD: 769px */
		@media (width >= 769px) {
			.ReasonInner_Box06_Service {
				margin-bottom: 120px;
				h4 {
					font-size: 3rem;
					text-align: center;
					margin-bottom: 40px;
				}
				ul {
					width: 50%;
					margin: 0 auto;
				}
				li {
					position: relative;
					font-size: 2rem;
					margin-bottom: 20px;
					padding-left: 40px;
					&::before {
						content: '';
						position: absolute;
						top: 0;
						left: 0;
						width: 20px;
						height: 20px;
						background: url(../../img/about/check.svg) no-repeat center center;
						background-size: contain;
					}
				}
			}
		}

		/* MD: 769px */
		@media (width >= 769px) {
			li {
				.num {
					font-size: 4rem;
					margin-bottom: 30px;
				}
				h3 {
					font-size: 3rem;
					text-align: center;
					margin-bottom: 30px;
				}
				p {
					margin-bottom: 120px;
					text-align: center;
				}
			}
		}
		.ReasonInner_Box06_Item {
			h4 {
				font-size: 2.5rem;
				text-align: center;
				margin-bottom: 40px;
			}
		}
		.ReasonInner_Box06_Item_Contents {
			width: 100vw;
			margin-left: calc(50% - 50vw);
			padding-left: calc(-50% + 50vw);
			padding-right: calc(-50% + 50vw);
			padding-bottom: 80px;
			/* background: rgb(251, 251, 251); */
			margin-bottom: 60px;
			.ReasonInner_Box06_Item_Contents_box {
				width: 100%;
			}
			h5 {
				font-size: 1.5rem;
				text-align: center;
				line-height: 2;
				margin-top: 30px;
			}
		}
		/* MD: 769px */
		@media (width >= 769px) {
			.ReasonInner_Box06_Item_Contents {
				margin-bottom: 120px;
				justify-content: center;
				gap: 80px;
				.ReasonInner_Box06_Item_Contents_box {
					width: 28%;
				}
			}
		}
		.ReasonInner_Box06_Schedule {
			.tableWrap {
				width: 100%;
				max-width: 806px;
				margin: 0 auto 80px;
				overflow-x: auto;
				-webkit-overflow-scrolling: touch;
			}

			.tableWrap .ttl {
				font-family:
					'Zen Kaku Gothic New', 'Hiragino Sans', 'Hiragino Kaku Gothic ProN', Meiryo, 'sans-serif';
				font-weight: 500;
				font-size: inherit;
				line-height: 1.5;
				margin: 0;
			}

			.tableWrap p {
				margin-top: 0;
			}
			.tableWrap {
				margin-bottom: 80px;
			}

			.tableWrap p:not(.ttl) {
				font-size: 14px;
				line-height: 2;
				margin-top: 36px;
			}

			table {
				width: 100%;
				min-width: 806px;
				letter-spacing: 0;
			}

			tr {
				border-bottom: 1px solid #999;
			}

			th,
			td {
				padding: 18px 10px 20px;
				position: relative;
			}

			th:after,
			td:after {
				content: '';
				position: absolute;
				width: 1px;
				height: calc(100% - 8px);
				background: #999;
				top: 4px;
				right: 0;
			}

			th:last-child:after,
			td:last-child:after {
				height: 100%;
				background: #999;
				top: 0;
			}

			thead tr {
				font-family:
					'Zen Kaku Gothic New', 'Hiragino Sans', 'Hiragino Kaku Gothic ProN', Meiryo, 'sans-serif';
				font-size: 13px;
				line-height: 1.5;
				font-weight: 500;
				border-top: 1px solid #999;
				background: #cac6bd;
			}

			thead th {
				border-left: none;
			}

			thead th:first-child {
				border-left: 1px solid #999;
			}

			tbody tr:nth-child(even) {
				background: #f5f4f2;
			}

			tbody td:first-child {
				font-family:
					'Zen Kaku Gothic New', 'Hiragino Sans', 'Hiragino Kaku Gothic ProN', Meiryo, 'sans-serif';
				font-size: 10px;
				font-weight: 500;
				text-align: center;
				vertical-align: middle;
				border-left: 1px solid #999;
			}

			td {
				font-size: 12px;
				line-height: 1.6;
				text-align: center;
				vertical-align: middle;
			}

			.taL td {
				text-align: left;
			}

			.listTable {
				margin-bottom: 30px;
			}

			.listTable li {
				width: 100%;
				height: 160px;
				margin-top: -1px;
				border: 1px solid #999;
			}

			.listTable li:nth-child(odd) {
				background: #f5f5f5;
			}

			.listTableTtl {
				width: calc(10% - 1px);
				height: 100%;
				float: left;
				border-right: 1px solid #999;
				text-align: center;
				position: relative;
			}

			.listTableTtl span {
				width: 100%;
				position: absolute;
				top: 50%;
				margin-top: -4px;
				transform: translate(-50%, -50%);
			}

			.listTableTxt {
				width: 90%;
				height: 100%;
				float: right;
				font-size: 16px;
				line-height: 1.8;
				position: relative;
			}

			.listTableTxt p {
				position: absolute;
				top: 50%;
				left: 40px;
				margin-top: -4px;
				transform: translateY(-50%);
			}

			.listTableSubTtl {
				margin-bottom: 16px;
				font-size: 19px;
				display: block;
			}

			#other p {
				font-size: 14px;
				line-height: 1.8;
			}
		}

		/* MD: 769px */
		@media (width >= 769px) {
			.ReasonInner_Box06_Schedule {
				.tableWrap {
					/* margin: 0 auto 0 140px; */
					overflow-x: visible;
				}

				table {
					min-width: 0;
				}
			}

			/* table */

			.tableWrap {
				margin-bottom: 120px;
			}

			.tableWrap p:not(.ttl) {
				font-size: 14px;
				line-height: 2;
				margin-top: 36px;
			}

			table {
				width: 100%;
			}

			th,
			td {
				padding: 18px 20px 22px;
			}

			thead tr {
				font-family:
					'Zen Kaku Gothic New', 'Hiragino Sans', 'Hiragino Kaku Gothic ProN', Meiryo, 'sans-serif';
				font-size: 15px;
				font-weight: 500;
				background: #cac6bd;
			}

			tbody tr:nth-child(even) {
				background: #f5f4f2;
			}

			tbody td:first-child {
				font-family:
					'Zen Kaku Gothic New', 'Hiragino Sans', 'Hiragino Kaku Gothic ProN', Meiryo, 'sans-serif';
				font-size: 15px;
				font-weight: 500;
				text-align: center;
			}

			td {
				font-size: 13px;
				line-height: 1.8;
				text-align: center;
			}

			.taL td {
				width: 20px;
				text-align: left;
			}

			.listTable {
				margin-bottom: 30px;
			}

			.listTable li {
				width: 100%;
				height: 160px;
				margin-top: -1px;
				border: 1px solid #999;
			}

			.listTable li:nth-child(odd) {
				background: #f5f5f5;
			}

			.listTableTtl {
				width: calc(10% - 1px);
				height: 100%;
				float: left;
				border-right: 1px solid #999;
				text-align: center;
				position: relative;
			}

			.listTableTtl span {
				width: 100%;
				position: absolute;
				top: 50%;
				margin-top: -4px;
				transform: translate(-50%, -50%);
			}

			.listTableTxt {
				width: 90%;
				height: 100%;
				float: right;
				font-size: 16px;
				line-height: 1.8;
				position: relative;
			}

			.listTableTxt p {
				position: absolute;
				top: 50%;
				padding: 0 40px;
				margin-top: -4px;
				transform: translateY(-50%);
			}

			.listTableSubTtl {
				margin-bottom: 16px;
				font-size: 19px;
				display: block;
			}

			#other p {
				font-size: 14px;
				line-height: 1.8;
			}
		}
	}
}

.AboutCta {
	padding-bottom: 60px;
	.AboutCtaInne {
		width: 90%;
		margin: 0 auto;
		max-width: 1200px;
		h2 {
			font-size: 2rem;
			text-align: left;
			border-bottom: #333 1px dotted;
			line-height: 2;
			margin-bottom: 30px;
		}
		.txt01 {
			font-size: 1.5rem;
			margin-bottom: 20px;
		}
		.txt02 {
			font-size: 2rem;
			line-height: 2;
			margin-bottom: 20px;
		}
		.txt03 {
			font-size: 1.5rem;
			margin-bottom: 55px;
		}
		.AboutCtaBtn {
			text-align: center;
			a {
				width: fit-content;
				padding: 15px 50px;
				display: inline-block;
				border: 1px solid #333;
				font-size: 1.5rem;
			}
		}
	}
}

/* MD: 769px */
@media (width >= 769px) {
	.AboutCta {
		padding-bottom: 150px;
		.AboutCtaInne {
			.AboutCtaInner_Box {
				align-items: flex-start;
				justify-content: space-between;
				.AboutCtaInner_Box_Bnr {
					width: 49;
				}
				.AboutCtaInner_Box_Text {
					width: 42%;
				}
			}
			h2 {
				font-size: 3rem;
				margin-bottom: 60px;
			}
			.txt02 {
				font-size: 3rem;
			}
			.AboutCtaBtn {
				a {
					padding: 20px 37%;
				}
			}
		}
	}
}
