@charset "utf-8";

/*メイン画像エリア*/
#main_area{position:relative;width:100%;max-height: 350px;height: 17vw; background: #eeefea;}
#main_area img{
	position: absolute;
	bottom:0;
	right:3%;
	max-width:46%;
	min-width: 36%;
}
#main_area p{
	white-space: nowrap;
	position: absolute;
	top:50%;
	left:15%;
	transform: translateY(-50%);
	font-size:min(2.0vw,36px);
	font-size:max(2.0vw,23px);
	letter-spacing: 0.5vw;
	font-weight: 500;
	color:#000;
}
#main_area p span{
	display: block;
	font-size:min(0.9vw,17px);
	font-size:max(0.9vw,14px);
	letter-spacing: 0.1vw;
	font-weight: bold;
	color:#0075c1;
	
}
/*ページ内リンクボタン*/
.menu li{border-radius: 10px;}
.menu li:nth-child(odd){background-color:#f0f7fb; }
.menu li:nth-child(even){background-color:#f4f2ef;}
.menu li a{display:flex;align-items: center;color:#000;padding:15px;}
.menu li a::before{display:block; content:""; width:68px; height: 69px; margin-right:20px;background-size:contain;background-repeat: no-repeat;}
.menu li:nth-child(1) a::before{background-image:url("../images/inspection/icon1.webp");}
.menu li:nth-child(2) a::before{background-image:url("../images/inspection/icon2.webp");}
.menu li:nth-child(3) a::before{background-image:url("../images/inspection/icon3.webp");}


/*画像と重なるパターン*/
.imgboxL{position: relative;}
.imgboxL > p,.imgboxL div{
	position: absolute;top:50%;left:30%;transform: translateY(-50%);
	background:#FFFFFF;padding:20px;border-radius: 15px;
	box-shadow: 5px 5px 10px 0px rgba(0, 0, 0, 0.4);
}
h3.tiS{font-size:19px;}
/*大阪市の検診*/
.mh > div{display: flex;flex-direction: column;}
.mh > div .kensin{flex-grow:1;}
dl.kensin div{display: flex;margin-bottom:10px;}
dl.kensin dt{font-weight:bold;width:7.5rem;}
dl.kensin dd{width:calc(100% - 7.5rem);}
ul.list li{display:inline-block;margin-right:10px;}
ul.list li::before{content: "";display: inline-block;width:10px; height: 10px; vertical-align: middle; background:#0075c1;border-radius: 10px; margin-right:5px;}
ul.list li:not(:last-child){margin-bottom: 10px;}
.pd30{padding:30px;}
.right{text-align:right;}

/*健診項目表　table*/
.scroll-hint {display: none;}
table{width: 100%;}
th,td{border:1px solid #b3b3b3;padding:10px;vertical-align: middle;color:#000;}
th{background-color:#f4f2ef;}
th:first-child{width:34%;}
th:not(:first-child){width:22%;}
table tr:not(:first-child) th{text-align:left;}
table tr:not(:last-child) td{text-align:center;color:#0075c1;font-size:26px;}
table tr:last-child td{text-align:center;}
/*付加健診*/
.table2 td{font-size:inherit !important;color:#000 !important;}


/*フォトスライダー*/
.slide-wrapper {
	width:100%;
	height: 300px;
	overflow: hidden;
}
.slider{
	display: flex;
	width: max-content;
	animation: scrollLeft linear 25s infinite;
}
.slider li{
	position: relative;
	width:400px;
	height: 300px;
	object-fit: cover;
}
@keyframes scrollLeft {
	0% {transform: translateX(0);}
	100% {transform: translateX(-50%);}
}
.slider li p{
	padding:10px;
	color:#FFF;
	text-align: center;
	border-radius: 5px;
	position: relative;
	bottom:55px;
	background:rgba(0,117,193,0.8);
	width:95%;
	margin: auto;
	left: 0;
	rigth:0;
	font-size:min(0.8vw,16px);
	font-size:max(0.8vw,14px);
}
/* レスポンシブ
------------------------------------------------------------*/

/* 1280px以下から
------------------------------------------------------------*/
@media only screen and (max-width:1280px){
	body {min-width: 1230px!important;}
	#main_area{height: 230px;}
}


/* 768px以下から
------------------------------------------------------------*/
@media only screen and (max-width:768px){
	body {min-width: 718px!important;}
	#main_area{max-height: 160px;height: 26vw;}
	/*ページ内リンクボタン*/
	.menu li{width:100%;margin-bottom: 20px !important;}
	
	/*画像と重なるパターン*/
	.imgboxL{position:inherit;}
	.imgboxL img{margin:auto;max-width:100%;}
	.imgboxL > p,.imgboxL div{
		position: static;width:90%;
		padding:20px 10px;border-radius: 10px;
		transform: translateY(-30%);
		margin:auto;
	}
	.imgboxL.mb80{margin-bottom: 0 !important;}
	.pd30{padding:15px 10px;}
	h3.tiS{font-size:18px;}
}
/* 650px以下から
------------------------------------------------------------*/
@media only screen and (max-width:650px){
	/*健診項目表　table*/
	.tablewrap{overflow-x: scroll;position: relative;}
	.tablewrap table{width:700px;}
	.scroll-hint {
		display: block;
		opacity: 0;
		transition: opacity 0.5s ease;
		position: absolute;
		top: 10%;
		left: 50%;
		transform: translateX(-50%);
		background: rgba(0,0,0,0.6);
		color: #fff;
		padding: 15px;
		border-radius: 4px;
		font-size: 12px;
	}
	.scroll-hint.visible {
		opacity: 1;
		animation: fadeOut 5s ease-in forwards;
	}
	@keyframes fadeOut{
		0%{opacity: 1;}
		30%{opacity: 0.1;}
		60%{opacity: 1;}
		100%{opacity: 0;}
	}
}
/* 500px以下から
------------------------------------------------------------*/
@media only screen and (max-width:500px){
    body {min-width: inherit!important;width: 100%;}
	#main_area{max-height: 250px;height:50vw;background-color:#FFF; }
	#main_area img{
		position: absolute;
		top:0;
		left:50%;
		transform: translateX(-50%);
		max-width: 430px;
		width:100%;
	}
	#main_area p{
		top:inherit;
		bottom:5%;
		left:50%;
		transform: translateX(-50%);
		min-width:60%;
		text-align: center;
		background:#FFFFFF;
		padding:15px 25px;
		border-radius: 10px;
		box-shadow: 0px 0px 15px -5px #777777;
		z-index:99;
	}
	/*ページ内リンク*/
	.menu li a{padding:10px;}
	.menu li a::before{width:50px; height: 50px; margin-right:15px;}
	/*大阪市の検診*/
	dl.kensin div{flex-direction: column;}
	dl.kensin dt,dl.kensin dd{width:100%;}
	/*画像と重なるパターン*/
	.imgboxL > p,.imgboxL div{
		width:95%;
		transform: translateY(-10%);
		box-shadow: 0px 5px 5px 0px rgba(0, 0, 0, 0.4);
	}
	/*スライダー*/
	.slider li{
		width:300px;
		height:225px;
	}
	.sp_non{display:none;}

}