@charset "utf-8";
/*メイン画像エリア*/
#main_area{
	position: relative;
	z-index: 1;
	margin-bottom: 50px;
}
#main_area > div{
	position: relative;
	justify-content: space-between;
	background:#eaf9e6;
	height:640px;

}
#main_area picture.mainimg{
	position: absolute;
	white-space: nowrap;
	right:0px;
	max-width:1200px;
	width:60%;
	height: 100%;
	padding:50px;

}
#main_area .mainimg img{
	border-radius: 20px;
	width:100%;
	height:100%;
	object-fit:cover;
}
#main_area p{
	white-space: nowrap;
	position:absolute;
	top:50%;
	left:50px;
	transform: translateY(-50%);
	z-index: 2;
	font-size: 1.7vw;
	letter-spacing: 0.4em;
	line-height: 1.7;
	font-weight: 500;
 	text-shadow:1px 1px 0 #FFF, -1px -1px 0 #FFF,-1px 1px 0 #FFF, 1px -1px 0 #FFF,0px 1px 0 #FFF,  0-1px 0 #FFF,-1px 0 0 #FFF, 1px 0 0 #FFF;
	font-family:"游明朝", YuMincho, "Hiragino Mincho ProN W3", "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
}
#main_area p span{font-size:2.2vw;}
#main_area img.hour{
	position: absolute;
	left:50%;
	transform: translateX(-50%);
	bottom: -70px;
}

/*診療メニュー*/
.menu a{display:block;display:flex; align-items:center; padding:10px; border-radius: 5px;}
.menu a span{margin-left:10px;}

/*特徴*/
#feature{position:relative;}
#feature{
	background-image:
	url("../images/bg_futaba.webp"), url("../images/bg_futaba.webp");
	background-size: 180px, 250px;
	background-position: 2% 30px, 103% 80%;
	background-repeat: no-repeat,no-repeat;
}
.imgboxR,.imgboxL{display:flex; justify-content: space-between;align-items: flex-start;}
.imgboxR img{order:2; max-width:360px; width:100%; height: auto;}
.imgboxR div{order:1; padding:15px;}
.feature li{counter-increment: feature;}
.feature li h3::before{content: "FEATURE"counter(feature);display: block;color:#60ab4a;font-weight: 400;}

/*診療方針*/
.policy h2::after{content:"TREATMENT POLICY"; color:#60ab4a;display: block;font-size: 18px;font-weight: 400;}
.policy img{max-width:330px; width:100%; height: auto;}
.policy .imgboxL div{padding:15px;}
.policy .imgboxL p{line-height: 2.0;}

/*トピックス*/
.w900{max-width:900px; width:100%;margin: auto;}
.topics h2::after{content:"NEWS & TOPICS"; color:#60ab4a;display: block;font-size: 18px;font-weight: 400;}
.topics > div{padding:5px; border-bottom: 1px solid #d1cbc3;}
.topics > div a::after{content:"";width:27px;height:27px;background-image:url("../images/icon_arrow1.webp");background-size: contain;display: inline-block;vertical-align: middle;margin-left:10px;}
.topics li{padding:15px; border-bottom: 1px solid #d1cbc3;}
.topics li a{display: flex;}
.topics li time{width:7em;color:#60ab4a;}
/*----------------------------------------------------------*/
/* レスポンシブ
------------------------------------------------------------*/
/* 1500px以下から
------------------------------------------------------------*/
@media only screen and (max-width:1500px){
	#feature{
		background-image:
		url("../images/bg_futaba.webp"), url("../images/bg_futaba.webp");
		background-size: 150px, 150px;
		background-position: -2% 0px, 102% 100%;
		background-repeat: no-repeat,no-repeat;
	}
}
/* 1200px以下から
------------------------------------------------------------*/
@media only screen and (max-width:1200px){

	#main_area picture.mainimg{
		max-width:1080px;
		width:70%;

	}
	#main_area p{
		font-size: 1.25rem;
		letter-spacing: 0.3em;
		line-height: 200%;
		font-weight: 500;
		text-shadow:1px 1px 0 #FFF, -1px -1px 0 #FFF,-1px 1px 0 #FFF, 1px -1px 0 #FFF,0px 1px 0 #FFF,  0-1px 0 #FFF,-1px 0 0 #FFF, 1px 0 0 #FFF;
		font-family:"游明朝", YuMincho, "Hiragino Mincho ProN W3", "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
	}
	#main_area p span{font-size:2.2vw;}
	#feature{
		background-image:
		url("../images/bg_futaba.webp"), url("../images/bg_futaba.webp");
		background-size: 150px, 150px;
		background-position: -2% 0px, 102% 100%;
		background-repeat: no-repeat,no-repeat;
	}
}
/* 1080px以下から
------------------------------------------------------------*/
@media only screen and (max-width:1080px){
	body {min-width: 1030px!important;}

	#main_area p span{font-size:1.8rem;}
	#main_area img.hour{
		position: absolute;
		bottom: -50px;
	}
	#feature{
		background-image:
		url("../images/bg_futaba.webp"), url("../images/bg_futaba.webp");
		background-size: 120px, 100px;
		background-position: -2% 0px, 102% 100%;
		background-repeat: no-repeat,no-repeat;
	}
}


/* 768px以下から
------------------------------------------------------------*/
@media only screen and (max-width:768px){
	#main_area{
		margin-bottom: 150px;
	}
	#main_area > div{
		height:640px;

	}
	#main_area picture.mainimg{
		max-width:768px;
		width:100%;
		padding:20px;
	}
	#main_area p{
		font-size: 1.375rem;
		letter-spacing: 0.3em;
		line-height: 200%;
	}
	#main_area img.hour{
		position: absolute;
		left:50%;
		transform: translateX(-50%);
		bottom: -100px;
	}

	/*特徴*/
	.imgboxR img{order:2; max-width:250px; width:100%; height: auto;}

	/*診療方針*/
	.policy img{max-width:250px; width:100%; height: auto;}
	/*トピックス*/
	.topics li a{flex-wrap: wrap;}
	.topics li time{width:100%;}
}


/* 500px以下から
------------------------------------------------------------*/
@media only screen and (max-width:500px){
    body {min-width: 100% !important;width: 100%;}
	#main_area{
		margin-bottom:60px;
	}
	#main_area > div{
		height:450px;
		background: none;
	}
	#main_area picture.mainimg{
		max-width:500px;
		width:100%;
		height: 100%;
		padding:0px;

	}
	#main_area .mainimg img{
		border-radius: 10px;
	}

	#main_area p{
        left: 50%;
        transform: translateX(-50%);
		top:260px;
		font-size: 4vw;
		width:100%;
		text-align: center;
		background:rgba(255,255,255,0.7);
		letter-spacing: 0.2em;
		line-height: 1.6rem;
		padding:15px 0;
		border-radius: 15px;
		text-shadow:none;
		font-weight: bold;
	}
	#main_area p span{font-size:5.5vw;}
	#main_area img.hour{
		position: absolute;
		top: 400px;
		max-width:440px;
		min-width: inherit;
		width: 100%;
		bottom: -150px;
	}
	/*診療案内*/
	.menu img{width:70px;}
	/*特徴*/
	.imgboxR,.imgboxL{flex-wrap:wrap;}
	.imgboxR img{order:1; max-width:360px; width:100%;margin:0 auto 15px;}
	.imgboxR div{order:2; padding:0px;}
	#feature{
		background-image:
		url("../images/bg_futaba.webp"), url("../images/bg_futaba.webp");
		background-size: 90px, 100px;
		background-position: -2% 0px, 102% 100%;
		background-repeat: no-repeat,no-repeat;
	}
	/*診療方針*/
	.policy img{width:100%;margin:auto;}
	.policy .imgboxL div{width:100%;padding:15px 0;}
	.policy .imgboxL p{line-height: 1.6;}

}


