@charset "utf-8";

.t_section {
	padding: 150px 0;
}

.calendar {
	min-height: 445px;
}

#wrapper {
	padding-top: 0;
}

.under_page_wrap #wrapper {
	padding-top: 100px;
}

/*その他の追加変更 ここから*/
.m_ttl01 {
	margin-bottom: 50px;
	padding-bottom: 41px;

	&:before {
		width: 50px;
	}

	.txt01 {
		font-size: 6.7rem;
	}

	.txt02 {
		font-size: 2.5rem;
		margin-top: 18px;

		strong {
			font-size: 4.9rem;
		}
	}
}

.m_ttl02_wrap {
	margin-bottom: 37px;
}

.m_ttl02 {
	font-size: 5rem;
}

.m_ttl02_more {
	--icon-right: -15px;
	--icon-size: 30px;
	font-size: 1.8rem;
	padding: 5px 43px 11px 14px;

	&:before {
		top: calc(50% - 0.2rem);
	}
}

.btn01 {
	--btn-height: 70px;
	--btn-width: 380px;
	--icon-right: -15px;
	--icon-size: 50px;
	font-size: 2rem;
	padding: 15px 50px 15px 50px;
	width: fit-content;
	letter-spacing: 0.05em;
}

.btn01:before,
.btn01:after {
	top: calc(50% - 2px);
	transition: 0.5s;
}

.btn01:before {
	-webkit-mask: url(../images/icon_arrow_long.png) center / 100% no-repeat;
	mask: url(../images/icon_arrow_long.png) center / 100% no-repeat;
}

.btn01:after {
	-webkit-mask: url(../images/icon_arrow_long.png) center / 100% no-repeat;
	mask: url(../images/icon_arrow_long.png) center / 100% no-repeat;
}

.btn_white {
	&:before {}

	&:after {}
}

.btn05 {
	--gutter: 3px;
	padding: 10px 47px 10px 10px;
	font-size: 1.9rem;
	min-height: 70px;

	&:after {
		width: 60px;
	}

	span {
		letter-spacing: 0;

		&:before,
		&:after {
			top: calc(50% - 1px);
		}

		&:before {
			right: 10px;
			width: 35px;
		}

		&:after {
			right: 10px;
			width: 10px;
		}
	}

	&:hover {
		opacity: 0.4;
	}
}

/*______________________________________________________________________________________
^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
m_mv
______________________________
^^^^^^^^^^^^^^^^^^^^^^^^^^^^*/
.m_mv {
	position: relative;
}

.m_mv .m_mv_item picture {
	/* position: relative;
	overflow: hidden;
	height: 100vh;
	width: 100%;
	display: block;

	img {
		width: 100%;
		height: 100%;
		position: absolute;
		top: 0;
		left: 0;
		object-fit: cover;
		-webkit-backface-visibility: visible;
		backface-visibility: visible;
	} */
}

.m_mv_txt {
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 628px;
	height: auto;
}

/*______________________________________________________________________________________
^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
t_xxx
______________________________
^^^^^^^^^^^^^^^^^^^^^^^^^^^^*/
.t_trouble {
	--gutter: 15px;
	padding: 153px 0 164px;

	.t_trouble_in {
		&:before {
			content: '';
			display: block;
			position: absolute;
			top: 0;
			left: 0;
			width: 100%;
			height: var(--gutter);
			z-index: 1;
			background: #b2b2b2;
			opacity: 0.3;
			box-shadow: 0px 0px 1.4rem -0.4rem rgba(0, 0, 0, 0.3);
		}

		&:after {
			content: '';
			display: block;
			position: absolute;
			top: 0;
			left: 0;
			width: 100%;
			height: var(--gutter);
			z-index: 1;
			opacity: 0.77;
			background: linear-gradient(95deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0) 8%, rgba(255, 255, 255, 0.4) 29%, rgba(255, 255, 255, 0) 80%, rgba(255, 255, 255, 1) 91%, rgba(255, 255, 255, 0) 100%);
		}
	}

	.inner {}

	.t_trouble_ttl {
		.txt01 {
			font-size: 4.1rem;
		}

		.txt02 {
			translate: -50% -54%;
			font-size: 12.7rem;
		}
	}

	.t_trouble_block {
		grid-template-columns: repeat(5, 1fr);
		gap: 25px;
		margin-top: 95px;
	}

	.t_trouble_item {
		box-shadow: 0px 0px 1.4rem -0.4rem rgba(0, 0, 0, 0.7);
	}

	.t_trouble_item_head {
		padding: 25px 0 10px;
		--gutter: 7px;

		&:after {
			width: 77%;
		}
	}

	.t_trouble_item_img {
		img {
			width: 171px;
		}

		figcaption {
			min-height: 58px;
			margin-top: 9px;

			.txt01 {
				font-size: 2rem;
			}

			.txt02 {
				margin-top: 2px;
				font-size: 1.7rem;
			}
		}
	}

	.t_trouble_item_body {
		padding: 11px 13px 36px;

		&:before,
		&:after {
			bottom: 16px;
		}

		&:before {
			right: 15px;
			width: 50px;
			height: 2px;
		}

		&:after {
			right: 16px;
			width: 10px;
		}
	}

	.t_trouble_item_txt {
		font-size: 1.6rem;
		letter-spacing: 0;
	}

	.t_trouble_cards {
		margin-top: 35px;
		grid-template-columns: repeat(4, 1fr);
		gap: 12px;
	}

	.t_trouble_card {
		padding: 0 20px 31px;

		&:before {
			width: 38%;
		}
	}

	.t_trouble_card_ttl {
		position: relative;
		background: var(--url) left center / 12.5vw no-repeat;
		background-size: 58px;
		padding: 25px 0 25px 70px;
		font-size: 2rem;
	}

	.t_trouble_card_txt {
		font-size: 1.55rem;
		margin-top: 11px;
		letter-spacing: 0;

		&:before,
		&:after {
			bottom: 19px;
		}

		&:before {
			right: 10px;
			width: 50px;
		}

		&:after {
			right: 10px;
			width: 10px;
		}
	}
}

/*______________________________________________________________________________________
^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
t_feature
______________________________
^^^^^^^^^^^^^^^^^^^^^^^^^^^^*/
.t_feature {
	padding: 121px 0 150px;
	overflow: hidden;

	&:before {
		top: -53px;
		left: calc(50% - 902px);
		width: 1465px;
	}

	&:after {
		top: 54.4%;
		left: calc(50% + 42px);
		width: 2105px;
		transform: translate(-50%, -50%);
	}

	.inner {
		&:before {
			bottom: 0;
			left: calc(50% - 904px);
			width: 1165px;
		}
	}

	.t_feature_ttl {
		margin-bottom: 80px;
		padding-bottom: 36px;

		.txt02 {
			margin-top: -10px;
		}
	}

	.t_feature_block {
		display: grid;
		gap: 80px;
	}
}

.m_feature {
	--bg: #aac2d4;
	--url: url(../images/top/feature_glass01.webp);
	position: relative;
	isolation: isolate;
	background: none;
	padding: 48px 70px 60px;

	&:before {
		top: 0;
		right: var(--over-margin);
		left: auto;
		width: calc(100% - var(--over-margin));
		height: 100%;
		background: var(--url) right center / auto 100% no-repeat;
	}

	&:after {
		content: '';
		display: block;
		position: absolute;
		top: 0;
		right: var(--over-margin);
		left: auto;
		width: calc(100% - var(--over-margin));
		height: 100%;
		z-index: -5;
		background-color: color-mix(in srgb, var(--bg) 20%, transparent);
	}

	&:nth-of-type(2n) {
		--url: url(../images/top/feature_glass02.webp);

		&:before {
			right: auto;
			left: var(--over-margin);
			background-position: left center;
		}

		&:after {
			right: auto;
			left: var(--over-margin);
		}
	}

	.m_feature_head {
		position: absolute;
		top: 50%;
		transform: translateY(-50%);

		.m_feature01 & {
			width: 654px;
			right: -33px;
			top: 48.4%;
		}

		.m_feature02 & {
			width: 653px;
			left: -20px;
			/* top: 50%; */
		}

		.m_feature03 & {
			width: 674px;
			right: -34px;
		}

		.m_feature04 & {
			width: 653px;
			left: 0;
			top: 62%;
		}

		.m_feature05 & {
			width: 654px;
			right: -33px;
			top: 39.7%;
		}
	}

	.m_feature_body {
		margin-top: 0;
		width: 430px;

		.m_feature:nth-of-type(2n) & {
			margin-left: auto;
		}
	}

	.m_feature_body_top {
		padding-bottom: 10px;
		gap: 20px;
	}

	.m_feature_num {
		top: -0.3em;

		.txt01 {
			font-size: 1.3rem;
			top: 0.15em;
			margin-right: 7px;
			letter-spacing: 0.02em;
		}

		.txt02 {
			font-size: 7.7rem;
		}
	}

	.m_feature_ttl {
		font-size: 2.8rem;
	}

	.m_feature_catch {
		margin-top: 23px;
		font-size: 1.8rem;
	}

	.m_feature_txt {
		margin-top: 8px;
		line-height: 1.875;
	}

	.m_feature_btns {
		margin-top: 23px;

		.btn {
			margin: 0;
			width: 100%;
			font-size: 1.8rem;
		}

		&:has(.btn:nth-of-type(2)) {
			display: grid;
			grid-template-columns: repeat(2, 1fr);
			gap: 30px;

			.btn {
				min-width: auto;
				width: auto;
				padding: 0 3px 0 0;
				--icon-size: 30px;

				&:before {
					-webkit-mask: url(../images/icon_arrow.png) center / 100% no-repeat;
					mask: url(../images/icon_arrow.png) center / 100% no-repeat;
				}

				&:after {
					-webkit-mask: url(../images/icon_arrow.png) center / 100% no-repeat;
					mask: url(../images/icon_arrow.png) center / 100% no-repeat;
				}
			}
		}
	}
}

/*______________________________________________________________________________________
^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
t_ortho
______________________________
^^^^^^^^^^^^^^^^^^^^^^^^^^^^*/
.t_ortho {
	background: #2c3a46 url(../images/top/ortho_bg.webp) center top / cover no-repeat;
	margin-top: 136px;
	padding: 122px 0 150px;

	.t_ortho_ttl {
		margin-bottom: 90px;
	}

	.t_ortho_block {
		position: relative;
	}

	.t_ortho_head {
		width: 587px;
		position: absolute;
		top: 20px;
		left: -8px;
		z-index: -1;
	}

	.t_ortho_body {
		margin-top: 0;
		gap: 20px;
		width: 640px;
		z-index: 10;
		position: relative;
		margin-left: auto;
	}

	.t_ortho_btns {
		grid-template-columns: repeat(4, 1fr);
		gap: 24px;
		margin-top: 80px;
	}
}

.m_ortho {
	padding: 27px 0 29px;
	box-shadow: 7px 7px 0px 0px color-mix(in srgb, #727272 70%, transparent);

	&:before {
		width: 40px;
	}

	&:after {
		content: '';
		display: block;
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: calc(100% + 0.5px);
		z-index: 20;
		opacity: 0;
		background: #fff;
		pointer-events: none;
		transition: 0.5s;
	}

	&:hover {
		opacity: 1;
	box-shadow: 7px 7px 0px 0px color-mix(in srgb, #727272 40%, transparent);

		&:after {
			opacity: 0.4;
		}
	}

	.m_ortho_ttl {
		font-size: 2.5rem;
		width: 232px;
		padding-left: 10px;
		min-height: 90px;
	}

	.m_ortho_txt {
		padding: 0 19px 0 29px;
		line-height: 1.84;
		font-size: 1.7rem;
	}

	.m_ortho_more {
		--clip-size: 30px;
		right: -0.5px;
		padding: 6px 70px 8px 48px;
		font-size: 1.5rem;
		line-height: 1;

		&:before,
		&:after {
			top: calc(50% - 1px);
		}

		&:before {
			right: 10px;
			width: 50px;
		}

		&:after {
			right: 10px;
			width: 10px;
		}
	}
}

/*______________________________________________________________________________________
^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
t_medical
______________________________
^^^^^^^^^^^^^^^^^^^^^^^^^^^^*/
.t_medical {
	background: url(../images/top/medical_bg_pc.webp) center top / cover;
	padding: 124px 0 150px;

	.t_medical_ttl {
		margin-bottom: 80px;
	}

	.t_medical_block {
		grid-template-columns: repeat(4, 1fr);
		gap: 24px;
	}

	.t_medical_item {
		position: relative;
		&:before {
			content: '';
display: block;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 10;
background: #fff;
opacity: 0;
pointer-events: none;
transition: 0.5s;
		}
		&:hover {
			opacity: 1;
			&:before {
				opacity: 0.4;
			}
		}
	}

	.t_medical_item_head {
		padding: 60px 0 56px;
		--gutter: 7px;

		&:after {
			width: 70%;
		}
	}

	.t_medical_item_ttl {
		font-size: 2.2rem;
	}

	.t_medical_item_body {
		padding: 8px 27px 19px;

		&:before,
		&:after {
			bottom: 16px;
		}

		&:before {
			right: 15px;
			width: 50px;
		}

		&:after {
			right: 15px;
			width: 10px;
		}
	}

	.t_medical_item_txt {
		line-height: 1.84;
		font-size: 1.6rem;
		letter-spacing: 0;
	}
}

/*______________________________________________________________________________________
^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
t_concept
______________________________
^^^^^^^^^^^^^^^^^^^^^^^^^^^^*/
.t_concept {
	background: var(--blue) url(../images/top/concept_bg01.webp) center / 250px;
	padding: 111px 0 153px;

	&:before {
		top: 0;
		left: 0;
		width: auto;
		height: 100%;
		aspect-ratio: 2520/1818;
		z-index: -1;
		background: url(../images/top/concept_bg02.webp) center top / auto 100% no-repeat;
	}

	&:after {
		bottom: 0;
		left: calc(50% + 41px);
		width: 650px;
		aspect-ratio: 650/794;
		background: url(../images/top/concept_img01.webp) center bottom / 100% no-repeat;
	}

	.t_concept_block {
		position: relative;
	}

	.t_concept_ttl {
		width: 536px;
		margin: 0;
		position: relative;
		left: -20px;
	}

	.t_concept_txt {
		--shadow: 0px 0px 0.7rem rgb(17 44 65 / 0.3);
		margin-top: 3px;
		width: 650px;

		p+p {
			margin-top: 0.9em;
		}
	}

	.t_concept_btns {
		margin-top: 46px;
		width: 650px;
		display: grid;
		grid-template-columns: repeat(2, 1fr);
		gap: 30px;

		.btn {
			width: auto;
			min-width: auto;
			margin: 0;
			padding: 0 10px 0 0;
		}
	}

	.t_concept_drs {
		margin-top: 0;
		display: grid;
		grid-template-columns: repeat(2, 1fr);
		gap: 20px;
		position: absolute;
		bottom: 0;
		right: 0;
		width: 520px;
	}
}

/*______________________________________________________________________________________
^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
t_info
______________________________
^^^^^^^^^^^^^^^^^^^^^^^^^^^^*/
.t_info {
	background-size: 78px;
	padding: 137px 0 136px;

	&:before {
		width: 140%;
		box-shadow: 0px 0px 13rem 0rem color-mix(in srgb, #000 100%, transparent) inset;
	}

	.t_info_block {
		grid-template-columns: repeat(2, 1fr);
		gap: 60px;
	}

	.t_info_item {
		padding: 29px 40px 43px;

		&:before {
			width: 49%;
		}
	}

	.t_info_calendars {
		grid-template-columns: repeat(2, 1fr);
		gap: 60px;
		margin-top: 60px;
	}

	.t_info_btn {
		margin-top: 80px;
	}
}

.m_newslist_item_in {
	padding: 17.5px 0;
}

.m_newslist_item_in .date {
	margin-right: 0;
}

.m_access {
	gap: 0px;
	padding: 16px 0 18px;
	margin-top: 18px;

	li {
		padding: 10px 0 10px 86px;

		&:before {
			width: 60px;
		}
	}
}

/*______________________________________________________________________________________
^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
t_other
______________________________
^^^^^^^^^^^^^^^^^^^^^^^^^^^^*/
.t_other {
	background: #f2ebe4 url(../images/top/other_bg.webp) center / cover no-repeat;
	padding: 139px 0 150px;

	.t_other_block {
		display: grid;
		grid-template-columns: repeat(2, 1fr);
		gap: 60px;
	}

	.t_other_instagram_wrap {
		.t_other_instagram_btn {
			width: 120px;
		}
	}
}

/*______________________________________________________________________________________
^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
t_recruit
______________________________
^^^^^^^^^^^^^^^^^^^^^^^^^^^^*/
.t_recruit {
	padding: 45px 0 59px;

	.t_recruit_en {
		top: -102px;
		left: calc(50% - 293px);
		width: 267px;
	}

	.t_recruit_ttl {
		font-size: 4.6rem;
		letter-spacing: 0.12em;
	}

	.t_recruit_txt {
		font-size: 2.1rem;
		margin: 5px auto 0;
		max-width: 620px;
		/* width: fit-content; */
	}

	.t_recruit_btn {
		width: 170px;
		margin: 0;
		position: absolute;
		right: 141px;
		top: 56%;
		transform: translateY(-50%);
	}
}