@charset "UTF-8";

/* --------------------------------------------
ANIMATION
--------------------------------------------- */

.animation.fadeIn {
		opacity: 0;
		transition: opacity .5s ease-in;
}

.animation.fadeIn.is-animation {
		opacity: 1;
}

.animation.fadeInUp {
		opacity: 0;
		translate: 0 calc( 20 var( --remBase));
		transition: opacity .5s ease-in, translate .5s ease-in-out;
}

.animation.fadeInUp.is-animation {
		opacity: 1;
		translate: 0 0;
}

@media screen and ( max-width: 750px) {
		.animation-sp.fadeInUp {
				opacity: 0;
				translate: 0 calc( 20 var( --remBase));
				transition: opacity .5s ease-in, translate .5s ease-in-out;
		}
		.animation-sp.fadeInUp.is-animation {
				opacity: 1;
				translate: 0 0;
		}
}

@media print, screen and ( min-width: 750.02px) {
		.animation-pc.fadeInUpOrder>* {
				opacity: 0;
				translate: 0 calc( 20 var( --remBase));
				transition: opacity .5s ease-in, translate .5s ease-in-out;
		}
		.animation-pc.fadeInUpOrder.is-animation>* {
				opacity: 1;
				translate: 0 0;
		}
		.animation-pc.fadeInUpOrder.is-animation>*:nth-of-type( 1) {
				transition-delay: .25s;
		}
		.animation-pc.fadeInUpOrder.is-animation>*:nth-of-type( 2) {
				transition-delay: .5s;
		}
		.animation-pc.fadeInUpOrder.is-animation>*:nth-of-type( 3) {
				transition-delay: .75s;
		}
		.animation-pc.fadeInUpOrder.is-animation>*:nth-of-type( 4) {
				transition-delay: 1s;
		}
		.animation-pc.fadeInUpOrder.is-animation>*:nth-of-type( 5) {
				transition-delay: 1.25s;
		}
}


/* --------------------------------------------
USER INTERFACE
--------------------------------------------- */

:where( h1, h2, h3, h4) {
		font-weight: 400;
		/*line-height: 1.6;
		letter-spacing: .04em;*/
}

@media screen and ( max-width: 750px) {
		h1 {
				font-size: 5.8rem;
		}
}

@media print, screen and ( min-width: 750.02px) {
		h1 {
				font-size: 3.6rem;
		}
}

@media screen and ( max-width: 750px) {
		h2 {
				font-size: 4.6rem;
		}
}

@media print, screen and ( min-width: 750.02px) {
		h2 {
				font-size: 2.8rem;
		}
}

@media screen and ( max-width: 750px) {
		h3 {
				font-size: 4.2rem;
		}
}

@media print, screen and ( min-width: 750.02px) {
		h3 {
				font-size: 2.4rem;
		}
}

@media screen and ( max-width: 750px) {
		h4 {
				font-size: 3.6rem;
		}
}

@media print, screen and ( min-width: 750.02px) {
		h4 {
				/*font-size: 2rem;*/
font-size: 2.4rem;
		}
}

.text {
		line-height: 1.8;
		letter-spacing: .04em;
}

@media screen and ( max-width: 750px) {
		.text {
				font-size: 3.2rem;
		}
}

@media print, screen and ( min-width: 750.02px) {
		.text {
				font-size: 1.6rem;
		}
}


/* --------------------------------------------
LINK01
--------------------------------------------- */

.link01 {
		display: grid;
		align-items: center;
}

.link01::after {
		font-size: 0;
		content: "";
		background-color: var( --green);
		background-image: url("/hospital/assets/img/ui/allow/right01.svg");
		background-repeat: no-repeat;
		border-radius: 50%;
		transition: translate .3s ease-in;
}

.link01 span {
		position: relative;
		font-weight: 600;
		color: #0d6c44;
		text-align: center;
		text-indent: .04em;
		letter-spacing: .04em;
}

.link01 span::before {
		position: absolute;
		width: 100%;
		font-size: 0;
		content: "";
		background-color: currentColor;
		transition: scale .3s ease-in;
		transform-origin: right top;
		scale: 0 1;
}

.link01:hover::after {
		translate: calc( 5 var( --remBase)) 0;
}

.link01:hover span::before {
		transform-origin: left top;
		scale: 1 1;
}

@media screen and ( max-width: 750px) {
		.link01 span::before {
				bottom: calc( -12 var( --remBase));
				height: calc( 4 var( --remBase));
		}
}

@media print, screen and ( min-width: 750.02px) {
		.link01 span::before {
				bottom: calc( -5 var( --remBase));
				height: calc( 2 var( --remBase));
		}
}

.link02 {
		position: relative;
		display: grid;
		place-items: center;
		font-weight: 600;
		color: var( --green);
		text-align: center;
		text-indent: .04em;
		letter-spacing: .04em;
		background-color: var( --green);
		background-color: #fff;
		border-style: solid;
		border-radius: 100vmax;
		transition: background var( --transitionBase);
}

.link02:hover {
		background-color: #f5faf8;
}

.link02:hover::after {
		translate: calc( 5 var( --remBase)) 0;
}

.link02::after {
		position: absolute;
		font-size: 0;
		content: "";
		background: url("/hospital/assets/img/ui/allow/right03.svg") 0 0 / contain no-repeat;
		filter: invert( 29%) sepia( 98%) saturate( 375%) hue-rotate( 103deg) brightness( 91%) contrast( 95%);
		transition: translate var( --transitionBase);
}


/* --------------------------------------------
SWIPER MODULES
--------------------------------------------- */

.swipe-controllers {
		max-width: 100%;
}

.swipe-controllers :where( .swiper-button-prev, .swiper-button-next) {
		position: absolute;
		display: grid;
		align-items: center;
		margin: 0;
		font-size: 0;
		background-color: var( --green);
		border-color: var( --green);
		border-style: solid;
		border-radius: 50%;
		transition: background var( --transitionBase);
}

.swipe-controllers :where( .swiper-button-prev, .swiper-button-next)::after {
		content: none;
}

.swipe-controllers :where( .swiper-button-prev, .swiper-button-next) img {
		filter: invert( 100%) sepia( 100%) saturate( 0%) hue-rotate( 288deg) brightness( 102%) contrast( 102%);
		transition: filter var( --transitionBase);
}

.swipe-controllers .swiper-button-prev {
		left: 0;
		justify-content: start;
}

.swipe-controllers .swiper-button-next {
		right: 0;
		justify-content: end;
}

.swipe-controllers .swiper-button-disabled {
		opacity: 0;
}

.swipe-controllers .swiper-pagination {
		position: relative;
		top: 0;
		bottom: 0;
		display: grid;
		grid-auto-flow: column;
		align-items: center;
		justify-content: center;
		font-size: 0;
}

.swipe-controllers .swiper-pagination .swiper-pagination-bullet {
		width: 100%;
		height: 100%;
		margin-inline: 0;
		background-color: rgb( 0 0 0 / .3);
		opacity: 1;
}

.swipe-controllers .swiper-pagination .swiper-pagination-bullet-active {
		background-color: var( --green);
}

@media screen and ( max-width: 750px) {
		.swipe-controllers {
				position: relative;
				display: grid;
				align-items: center;
				justify-content: center;
				width: fit-content;
				min-height: calc( 82 var( --remBase));
				padding-inline: calc( 138 var( --remBase));
				margin-inline: auto;
		}
		.swipe-controllers :where( .swiper-button-prev, .swiper-button-next) {
				width: calc( 80 var( --remBase));
				height: calc( 80 var( --remBase));
				border-width: calc( 2 var( --remBase));
		}
		.swipe-controllers :where( .swiper-button-prev, .swiper-button-next):active {
				background-color: #fff;
		}
		.swipe-controllers :where( .swiper-button-prev, .swiper-button-next):active img {
				filter: invert( 29%) sepia( 98%) saturate( 375%) hue-rotate( 103deg) brightness( 91%) contrast( 95%);
		}
		.swipe-controllers :where( .swiper-button-prev, .swiper-button-next) img {
				height: calc( 29 var( --remBase));
		}
		.swipe-controllers :where( .swiper-button-prev, .swiper-button-next) {
				top: 50%;
				translate: 0 -50%;
		}
		.swipe-controllers .swiper-button-prev {
				padding-left: calc( 28 var( --remBase));
		}
		.swipe-controllers .swiper-button-next {
				padding-right: calc( 28 var( --remBase));
		}
		.swipe-controllers .swiper-pagination {
				grid-auto-rows: calc( 12 var( --remBase));
				grid-auto-columns: calc( 12 var( --remBase));
				row-gap: calc( 19 var( --remBase));
				column-gap: calc( 19 var( --remBase));
		}
}

@media print, screen and ( min-width: 750.02px) {
		.swipe-controllers :where( .swiper-button-prev, .swiper-button-next) {
				width: calc( 40 * 100% / 1248);
				height: calc( 40 var( --remBase));
				border-width: calc( 2 var( --remBase));
		}
		.swipe-controllers :where( .swiper-button-prev, .swiper-button-next):hover {
				background-color: #fff;
		}
		.swipe-controllers :where( .swiper-button-prev, .swiper-button-next):hover img {
				filter: invert( 29%) sepia( 98%) saturate( 375%) hue-rotate( 103deg) brightness( 91%) contrast( 95%);
		}
		.swipe-controllers :where( .swiper-button-prev, .swiper-button-next) img {
				height: calc( 22 var( --remBase));
		}
		.swipe-controllers .swiper-button-prev {
				left: 0;
				padding-left: calc( 10 var( --remBase));
		}
		.swipe-controllers .swiper-button-next {
				right: 0;
				padding-right: calc( 10 var( --remBase));
		}
		.swipe-controllers .swiper-pagination {
				grid-auto-rows: calc( 8 var( --remBase));
				grid-auto-columns: calc( 8 var( --percentBase));
				row-gap: calc( 19 var( --remBase));
				column-gap: calc( 19 var( --percentBase));
		}
}


/*--------------------------------------------
記事モジュール画像
---------------------------------------------*/
.article_module{
/*margin:0 0 40px 0;*/
}
.article_image{
    margin:0 0 20px 0;
    max-width : 938px;
}
.article_image img{
    /*width:100%;*/
border-radius: calc( 16 var(--remBase) );
}
.article_image_float{
    overflow:hidden;
}
.article_image_float .article_image{
    float:left;
padding:18px;
    /*padding:0 8px 0px 0;*/
}
.article_image_float .panel{
    float:left;
    margin:0 5px 0 0;
}
.article_image_left{
    float:left;
    margin:0px 20px 8px 0;
}
*html .article_image_left{
    float:left;
    margin:3px 8px 8px 0;
}
.article_image_right{
    float:right;
    margin:0px 0px 8px 20px;
}
/**▼画像パネル中央揃え▼**/
.article_image_wrapper {
    text-align: center;
    margin-top:20px;
    margin-bottom:10px;
}
.article_image_wrapper .article_image_float {
    text-align: left;
    display: inline-block;
    *zoom: 1;
}
/**▲画像パネル中央揃え▲**/

/**▼画像パネル中央揃え▼**/
.article_image_centre {
    text-align: center;
    /*margin: 0 auto;*/
    margin: 20px auto;
}
.article_image_centre .article_image {
    /*text-align: left;*/
    margin-left: auto;
    margin-right: auto;
margin-bottom:10px;
}
.article_image_centre .article_image img {
width:auto !important;
}

/**▲画像パネル中央揃え▲**/

.article_image .image_caption{
	font-size: calc( 18 var(--remBase) );
	margin-top: 5px;
	line-height: 1.4;
	text-align: left;
	font-weight: 700;
}
.article_image .image_title{
	font-weight:bold;
	font-size:14px;
	margin-top:5px;
	margin-bottom:10px;
	line-height:1.4;
	text-align: left;
}


@media screen and (max-width: 750px){
	.article_image_left{
	    float:none;
	    margin:3px 0 8px 0;
	}
	*html .article_image_left{
	    float:none;
	    margin:3px 0 8px 0;
	}
	.article_image_right{
	    float:none;
	    margin:3px 0 8px 0;
	}
	.article_image_float .article_image{
	    float:none;
	    padding:0 8px 8px 0;
	}
	.article_image img {
		/*width:100% !important;*/
margin:auto;
	}
	.article_image .image_caption{
		font-size: calc( 36 var(--remBase) );
		margin-top: 5px;
		line-height: 1.4;
		text-align: left;
		font-weight: 700;
	}

	
}

.clear{
clear: both;
    display: block;
    height: 0;
    overflow: hidden;
    visibility: hidden;
    width: 0;
}
.link01::after{
background-image:url("/hospital/assets/css/or1oq90000000c3u-img/right01.svg");
}.link02::after{
background-image:url("/hospital/assets/css/or1oq90000000c3u-img/right03.svg");
}