@charset "utf-8";
/* CSS Document */
/*-------- タブレット --------*/
@media screen and (max-width:800px){
	html {
		font-size: 8px;
	}
	body {
		max-width: 800px;
	}
	.page-link {
		width: 300px;
		margin: auto;
		background: #ECC440;
		padding: 2rem 0;
	}
	.page-link a {
		display: block;
		text-align: center;
		font-size: 2.4rem;
		width: 70%;
		margin: auto;
	}
	.page-link:hover a{
		border-bottom: 1px solid #fff;
	}

	/*------- ヘッダー -------*/
	#header {
		width: 95%;
		justify-content: space-between;
		align-items: flex-start;
		position: absolute;
		top:0;
		left: 50%;
		transform: translate(-50%);
		z-index: 2;
	}
	.head-logo {
		max-width: 200px;
	}
	.head-logo a {
		display: block;
	}
	.head-bnrs {
		gap: 3rem;
	}
	.head-bnrs .tel-bnr {
		max-width: 200px;
	}
	.tel-bnr a {
		display: block;
		text-align: center;
		font-size: 3rem;
	}
	.head-bnrs .web-bnr {
		max-width: 200px;
	}
	.web-bnr a {
		display: block;
		text-align: center;
		font-size: 3rem;
	}
	.tel-bnr a i,
	.web-bnr a i {
		margin-right: 1rem;
		font-size: 2.6rem;
	}

	/*メインビジュアル*/
	.mainvisual {
		height: 60vh;
	}
	.catch-copy {
		position: absolute;
		top:35%;
		transform: translate(-50%);
		left: 35%;
		background: url("../img/bg07.png");
		background-size: cover;
		padding: 4rem 0;
		width: 450px;
	}
	.catch-copy h2 {
		width: 90%;
		margin: auto;
		text-align: center;
		font-size: 4.6rem;
		line-height: 1.5;
		border-bottom: 1px solid #ccc;
	}
	.catch-copy h3 {
		text-align: center;
		font-size: 2.6rem;
		margin-top: 2rem;
		line-height: 1.5;
		position: relative;
	}
	.catch-copy h3::before {
		content: "";
		width: 120px;
		height: 90px;
		background: url("../img/deco15.png");
		background-size: cover;
		position: absolute;
		top:-5px;
		right: -30px;
	}
	.mv-bnr-wrapper {
		position: absolute;
		top: 18rem;
		right: 5rem;
		width: 25%;
	}
	.mv-bnr-wrapper a {
		display: block;
		margin-bottom: 3rem;
	}
	
	
	/*グローバルメニュー*/
	/*==ナビゲーション全体の設定*/
	nav{
		width: 90%;
		margin: auto;
	}
	
	
	/*------- お知らせ・カレンダー -------*/
	#news-calendar {
		padding: 12rem 0 5rem 0;
		background: url("../img/deco01.png")left 0% top 0% / 35% auto no-repeat,
			url("../img/deco02.png") right 0% top 0% / 35% auto no-repeat;
	}
	#news-calendar .inner {
		width: 700px;
		margin: auto;
		justify-content: space-between;
		align-items: flex-start;
	}
	
	.news .ttl,
	.calendar .ttl {
		width: 15rem;
	}
	.nc-box {
		border: dashed 1px #5BC7D8;
		padding: 3rem 0;
		box-sizing: border-box;
	}
    .news dl dd {
    width: 72%;
}
    .news dl dt {
    width: 28%;
}
    .news dt {
    font-size: 14px;
}

/*------- ブルーラジカルバナー -------*/
	#blueradical_bnr{
		width: 90%;
		margin: 0 auto;
	}

	/*------- 感染症対策*-------*/

	#covid19 {
		padding: 5rem 0;
	}
	.accordion-001 {
		max-width: 700px;
	}
	
	
	/*-------- かかりつけ医 --------*/
	#top-prevention-sp {
		padding: 10rem 0;
	}
	.top-message {
		width: 90%;
		margin: auto;
	}
	.top-message h4 {
		text-align: center;
		font-size: 3rem;
		line-height: 1.5;
		position: relative;
	}
	.top-message h4::before {
		content: "";
		width: 80px;
		height: 65px;
		background: url("../img/deco03.png");
		background-size: cover;
		position: absolute;
		top: -3rem;
		left: 1rem;
	}
	.top-message h4::after {
		content: "";
		width: 80px;
		height: 65px;
		background: url("../img/deco04.png");
		background-size: cover;
		position: absolute;
		top: 3rem;
		right: 1rem;
	}

	#top-prevention-sp .inner {
		width: 80%;
		margin: 5rem auto;
		flex-direction: column;
		gap:5rem;
	}
	#top-prevention-sp .inner .left {
		width: 100%;
		background: #C9E4F8;
		padding: 2rem 0;
		position: relative;
	}
	#top-prevention-sp .inner .left::before {
		content: "PREVENTION";
		color: #1B6DCB;
		font-size: 3rem;
		transform: rotate(90deg);
		position: absolute;
		top: 8rem;
		left: -12rem;

	}
	

	#top-prevention-sp .inner .right {
		width: 100%;
	}
	#top-prevention-sp .inner .right .b-txt {
		font-size: 3rem;
		margin-bottom: 2rem;
		text-align: center;
	}
	#top-prevention-sp .inner .right .s-txt {
		text-align: center;
		font-size: 2.2rem;
	}
	.topic01 {
		position: relative;
	}
	.topic01::before {
		content:"";
		width: 60px;
		height:55px;
		background: url("../img/deco05.png");
		background-size: cover;
		position: absolute;
		top: 0rem;
		left: 40%;
	}
	.topic01::after {
		content:"";
		width: 60px;
		height:55px;
		background: url("../img/deco06.png");
		background-size: cover;
		position: absolute;
		bottom: 3rem;
		right: 4rem;
	}
	.topic02 {
		position: relative;
	}
	.topic02::before {
		content:"";
		width: 60px;
		height:55px;
		background: url("../img/deco05.png");
		background-size: cover;
		position: absolute;
		top: 1rem;
		left: 40%;
	}
	.topic02::after {
		content:"";
		width: 80px;
		height:72px;
		background: url("../img/deco06.png");
		background-size: cover;
		position: absolute;
		bottom: 2rem;
		left: 2rem;
	}

	
	
	
	
	#movie {
		padding: 5rem 0 8rem 0;
	}
	.movies {
		width: 90%;
		margin: auto;
		justify-content: space-between;
	}
	.movielink {
		width: 45%;
	}
	.movielink a {
		display: block;
	}

	/*-------- 特徴 --------*/
	#feature {
		padding: 15rem 0 10rem 0;
		background:rgba(245,221,222,0.60);
	}
	.feature-wrapper {
		flex-direction: column;
		gap: 5rem;
	}
	.while-bar {
		width: 95%;
		margin: 8rem auto;
	}
	.feature-item {
		width: 90%;
		margin: auto;
		justify-content: space-between;
		align-items: center;
	}
	.feature-pic,
	.feature-txt {
		width: 48%;
	}
	.feature-txt h5 {
		color: #7D7D7D;
		font-size: 2.8rem;
		margin-bottom: 2rem;
	}
	.feature-txt h5 span {
		font-size: 4rem;
	}
	.feature-txt p {
		font-size: 2.2rem;
		line-height: 2;
	}
	.feature01 {
		position: relative;
	}
	.feature01::before {
		content: "";
		width: 100px;
		height: 120px;
		background: url("../img/deco09.png");
		background-size: cover;
		position: absolute;
		top: -16rem;
		right: 1rem;
	}
	.feature02 {
		position: relative;
	}
	.feature02::before {
		content: "";
		width: 90px;
		height: 100px;
		background: url("../img/deco10.png");
		background-size: cover;
		position: absolute;
		top: -14rem;
		left: 1rem;
	}
	.feature03 {
		width: 30%;
	}
	.feature03-2 {
		padding-top: 10rem;
		position: relative;
	}
	.feature03-2::before {
		content: "";
		width: 110px;
		height: 120px;
		background: url("../img/deco11.png");
		background-size: cover;
		position: absolute;
		top: -3rem;
		right: -1rem;
	}
	.feature03-2::after {
		content: "";
		width: 100px;
		height: 100px;
		background: url("../img/deco12.png");
		background-size: cover;
		position: absolute;
		bottom: -5rem;
		left: -8rem;
	}
	#feature .page-link {
		margin-top: 10rem;
	}
	
	
	/*-------- ご挨拶 --------*/
	#greeting,
	#greeting-sp{
		background: url("../img/bg06.jpg");
		background-size: cover;
		background-position: center;
	}
	#greeting .inner,
	#greeting-sp .inner{
		width: 80%;
		margin: auto;
		padding: 10rem 0 10rem 0;
		background: rgba(251,243,212,0.8);
	}
	.greeting-ttl {
		width: 150px;
		height: 150px;
		border-radius: 50%;
		margin: auto;
		background: #ECC440;
		position: relative;
	}
	.greeting-ttl h6 {
		font-size: 4rem;
		text-align: center;
		line-height: 150px;
	}
	.greeting-ttl::before {
		content: "";
		width: 100px;
		height: 110px;
		background: url("../img/deco13.png");
		background-size: cover;
		position: absolute;
		top: 5rem;
		left: -12rem;
	}
	.greeting-ttl::after {
		content: "";
		width: 100px;
		height: 110px;
		background: url("../img/deco14.png");
		background-size: cover;
		position: absolute;
		top: -5rem;
		right: -12rem;
	}
	.greeting-txt {
		width: 75%;
		margin: 5rem auto;
	}
	.greeting-txt p {
		text-align: center;
		font-size: 2.2rem;
		line-height: 2;
	}
	.greeting-name {
		width: 50%;
		margin: 0 auto 5rem auto;
		border-bottom: 1px solid #ccc;
	}
	.greeting-name p {
		text-align: center;
	}
	.greeting-name .position {
		font-size: 3rem;
	}
	.greeting-name .name {
		font-size: 4rem;
		color: #138273;
	}
	
	/*-------- 設備紹介 --------*/
	#Equipment-introduction {
		padding: 8rem 0;
	}
	.ei-wrapper {
		width: 95%;
		margin: 8rem auto 0 auto;
		justify-content: space-between;
	}
	.ei-wrapper .item {
		width: 48%;
		position: relative;
		margin-bottom: 8rem;
	}
	.ei-wrapper .item .item-card {
		width: 80%;
		background: #fff;
		box-shadow: 2px 2px 5px #ccc;
		padding: 3rem 0;
		position: absolute;
		bottom:-1rem;
		left: 50%;
		transform: translatex(-50%);
	}
	.ei-wrapper .item .item-card p {
		font-size: 18px;
		text-align: center;
		color: rgba(61,43,44,1.00);
	}

	
	/*-------- 診療案内 --------*/
	#medical {
		padding: 10rem 0 0 0;
	}
	.medical-ttl {
		width: 300px;
		height: 120px;
		margin:0 auto 10rem auto;
		padding-top: 3.2rem;
		box-sizing: border-box;
	}
	.medical-ttl h6 {
		text-align: center;
		font-size: 4rem;
	}
	#medical .container {
		width: 100%;
		padding: 1rem 0;
	}
	#medical .container .inner {
		align-items: center;
		gap:3rem;
	}
	#medical .container .container-ttl {
		width: 35%;
	}
	#medical .container .medical-wrapper {
		width: 60%;
		align-items: flex-start;
		gap:5rem;
	}
	#medical .container .medical-wrapper .medical-item {
		width: 25%;
	}
	#medical .container .medical-wrapper .medical-item a {
		display: block;
		margin-bottom: 2rem;
	}
	#medical .container .medical-wrapper .medical-item p {
		font-size: 1.8rem;
		line-height: 2;
	}
	.container01 {
		background: url("../img/bg0.jpg");
		background-size: cover;
	}
	.container03 {
		background: url("../img/bg02.jpg");
		background-size: cover;
	}
	
	/*--- バナーリンク ---*/
	.bnr-space {
		background: url("../img/bg10.png");
		background-size: cover;
	}
	.bnr-space .inner {
		width: 90%;
		margin: auto;
		background: rgba(255,255,255,0.8);
		padding: 10rem 0;
	}
	
	/*-------- フッター --------*/
	.foot-top {
		padding: 10rem 0;
	}
	.foot-top .inner {
		width: 90%;
		margin: 5rem auto;
		justify-content: space-between;
		align-items: center;
	}
	
	/*~~~~~~~~~~ 下層ページ ~~~~~~~~~~*/
	/*.s-mainvisual {
		height: 40vh;
		background: url("../img/mainvisual.png");
		background-position: center;
		background-size: cover;
		position: relative;
	}*/
	.page-ttl {
		position: absolute;
		top: 60%;
		left: 50%;
		transform: translate(-50%,-50%);
	}
	.page-ttl h2 {
		text-align: center;
		font-size: 5rem;
	}
	.page-ttl h2 span {
		font-size: 4rem;
		font-family: "Monotype Corsiva";
	}
	.sec-ttl {
		width: 90%;
		margin: 1rem auto;
		border-bottom: 1px solid #F275D1;
		padding-bottom: 0.8rem;
	}
	.sec-ttl h3 {
		margin-left: 16rem;
		font-size: 4rem;
		color: #555353;
		position: relative;
	}
	.sec-ttl h3::before {
		content: "";
		width: 15rem;
		height: 5rem;
		background: url("../img/deco16.png");
		background-size: cover;
		position: absolute;
		top: -1rem;
		left: -16rem;
	}

	.inner-flex {
		width: 70%;
		margin: 3rem auto;
		flex-direction: column;
		gap: 5rem;
	}
	.inner-flex .if-img,
	.inner-flex .if-txt {
		width: 100%;
	}
	.inner-flex02 {
		width: 90%;
		margin: 5rem auto;
		justify-content: space-between;
		align-items: center;
	}
	.inner-flex02 .if-img,
	.inner-flex02 .if-txt {
		width: 48%;
	}
	.inner-flex .if-txt h7 {
		font-size: 3rem;
		margin-bottom: 3rem;
	}
	.inner-flex .if-txt p,
	.inner-flex02 .if-txt p {
		font-size: 2.2rem;
		line-height: 2;
	}
	.mini-ttl {
		width: 80%;
		margin: 5rem auto;
		border-bottom: 1px solid #ECC440;
	}
	.mini-ttl p {
		text-align: center;
		color: #ECC440;
		font-size: 3.2rem;
	}
	
	
	/*-------- 院長・スタッフ紹介 --------*/

	/*院長紹介*/
	#doctor-intro {
		padding: 5rem 0;
	}
	.career {
		background: rgba(245,248,201,0.8);
		padding: 3rem;
		box-sizing: border-box;
	}
	.career-ttl {
		font-size: 3rem;
		margin-bottom: 2rem;
	}
	.career dl {
		justify-content: space-between;
		align-items: flex-start;
		font-size: 2rem;
	}
	.career dl dt {
		width: 20%;
		padding-bottom: 1rem;
	}
	.career dl dd {
		width: 80%;
		padding-bottom: 1rem;
	}
	.career dl p {
		margin-top: 2rem;
	}
	.doctor-career {
		width: 60%;
		margin: 5rem auto;
	}

	/*sスタッフ紹介*/
	#staff-intro {
		padding: 5rem 0;
	}
	.staff-inner {
		width: 70%;
		margin: 5rem auto;
		flex-direction: column;
		gap: 5rem;
	}
	.staff-img {
		width: 50%;
		margin: auto;
	}
	.staff-name {
		text-align: center;
		font-size: 2.4rem;
		margin-top: 2rem;
	}
	.staff-career {
		width: 100%;
	}
	
	/*-------- 医院紹介 --------*/
	/*初めての方へ*/
	#first {
	padding: 8rem 0;
}
.first-top-message {
	width: 90%;
	margin: 8rem auto;
	justify-content: space-between;
	align-items: center;
}
.first-top-message h4 {
	font-size: 24px;
	border-bottom: 1px solid #ffb6c1;
	padding-bottom: 5px;
	margin-bottom: 2rem;
	line-height: 1.5;
}
.ftm-img,
.ftm-txt {
	width: 48%;
}
.ftm-txt p {
	font-size: 16px;
	line-height: 2;
	width: 10%;
}

	/*医院紹介*/
	.commitment {
		padding: 3rem 0;
	}
	.commitment-ttl {
		text-align: center;
		font-size: 2.8rem;
		margin-bottom: 3rem;
	}
	
	
	/*-------- 診療案内 --------*/
	.medical-top {
		width: 95%;
		margin: 5rem auto 5rem auto;
		justify-content: center;
		align-items: center;
		gap:3rem;
	}
	.medical-top .item {
		width: 45%;
		padding: 2rem 0;
		border-radius: 5rem;
	}
	.mt-ttl {
		text-align: center;
		font-size: 3.6rem;
	}
	.mt-ttl span {
		font-size: 6rem;
	}
	.mt-item-flex {
		width: 96%;
		margin: 2rem auto 0 auto;
		justify-content: center;
		gap: 2rem;
	}
	.mt-item-flex {
		width: 96%;
		margin: 2rem auto 0 auto;
		justify-content: center;
		gap: 2rem;
	}
	.mt-link {
		width: 45%;
		background: #fff;
		padding: 2rem 0;
		border-radius: 3rem;
	}
	.mt-link a {
		display: block;
		text-align: center;
		font-size: 2.6rem;
		color: #7D7D7D;
	}
	.mt-link:hover {
		background:rgba(245,217,232,1.00);
	}
	.medical-content {
		padding: 5rem 0;
	}

	/*歯周病治療*/
	.pc-txt {
		width: 70%;
		margin: auto;
		font-size: 2rem;
		line-height: 2;
	}

	/*治療の流れ*/
	.medical-flow {
		width: 80%;
		margin: auto;
		padding: 8rem 0 0 0;
	}
	.mf-ttl {
		width: 50%;
		margin: auto;
		padding: 2rem 0;
		border-top: 1px solid #ECC440;
		border-bottom: 1px solid #ECC440;
	}
	.mf-ttl p {
		text-align: center;
		font-size: 3rem;
	}
	.flow-wrapper {
		padding: 5rem 0;
		flex-direction: column;
		gap: 5rem;
	}
	.flow-item {
		border:1px solid #ECC440;
	}
	.flow-ttl {
		background: #F5F8C9;
		padding: 1rem 0;
	}
	.flow-ttl p {
		font-size: 2.4rem!important;
		margin-left: 120px;
	}
	.flow-txt {
		width: 90%;
		margin: auto;
		padding: 3rem 0;
	}
	.flow-txt p {
		font-size: 2rem;
		line-height: 2;
	}
	.flow01 {
		position: relative;
	}
	.flow01::before {
		content:"01";
		font-family: "貂明朝";
		color: #fff;
		font-size: 4.6rem;
		width: 80px;
		height: 80px;
		border-radius: 50%;
		line-height: 80px;
		background: url("../img/bg05.jpg");
		text-align: center;
		position: absolute;
		top:-20px;
		left: 10px;
	}
	.flow02 {
		position: relative;
	}
	.flow02::before {
		content:"02";
		font-family: "貂明朝";
		color: #fff;
		font-size: 4.6rem;
		width: 80px;
		height: 80px;
		border-radius: 50%;
		line-height: 80px;
		background: url("../img/bg05.jpg");
		text-align: center;
		position: absolute;
		top:-20px;
		left: 10px;
	}
	.flow03 {
		position: relative;
	}
	.flow03::before {
		content:"03";
		font-family: "貂明朝";
		color: #fff;
		font-size: 4.6rem;
		width: 80px;
		height: 80px;
		border-radius: 50%;
		line-height: 80px;
		background: url("../img/bg05.jpg");
		text-align: center;
		position: absolute;
		top:-20px;
		left: 10px;
	}
	.flow04 {
		position: relative;
	}
	.flow04::before {
		content:"04";
		font-family: "貂明朝";
		color: #fff;
		font-size: 4.6rem;
		width: 80px;
		height: 80px;
		border-radius: 50%;
		line-height: 80px;
		background: url("../img/bg05.jpg");
		text-align: center;
		position: absolute;
		top:-20px;
		left: 10px;
	}

	/*小児歯科*/
	.commitment-wrapper {
		width: 100%;
		margin: 5rem auto 0 auto;
	}
	
	
	/*-------- 採用情報 --------*/
	#recruit {
		padding: 10rem 0 0 0;
	}
	#recruit .bottom-message {
		width: 100%;
		margin: 5rem auto;
	}
	#recruit .bottom-message p {
		font-size: 3rem;
		text-align: center;
		line-height: 2;
	}
	#recruit .bottom-message .tel-bnr {
		width: 300px;
		margin: 3rem auto;
		background: url("../img/bg05.jpg");
		background-size: cover;
		padding: 1rem 0;
	}
	#recruit .bottom-message .ffyg {
		font-size: 2.2rem;
		line-height: 2;
	}
	#recruit .recruit-inner{
		width: 80%;
		margin: 7rem auto;
	}

	/*-------- 診療時間・アクセス --------*/ 
	/*診療時間*/
	#hours {
		padding: 10rem 0 5rem 0;;
	}
	#hours .if-txt {
		text-align: center;
	}
	#hours .if-txt img {
		margin: 2rem auto;
	}
	#hours .if-txt p {
		text-align: center;
	}
	#hours .if-txt a {
		display: block;
		color: #ECC440;
		font-size: 3.6rem;
		text-align: center;
	}
	#hours .if-txt a i {
		font-size: 2rem;
		margin-right: 1rem;
	}
	.time-table {
		width: 70%;
		margin: 5rem auto 0 auto;
	}

	/*アクセス*/
	#access {
		padding: 10rem 0 5rem 0;
	}
	.access-map {
		width: 600px;
		margin: 5rem auto;
	}
	.access-map iframe {
		width: 100%;
		height: 300px;
	}
	.access-car {
		margin-bottom: 5rem;
	}
	.access-txt {
		font-size: 2rem;
		text-align: center;
		line-height: 2;
		margin: 3rem auto;
	}
	.access-images {
		width: 80%;
		margin: auto;
		justify-content: space-between;
		align-items: center;
	}
	.access-images img {
		width: 45%;
	}
	
	
}


/*-------- スマホ --------*/
@media screen and (max-width:430px){
	html {
		font-size: 8px;
	}
	body {
		max-width: 430px;
	}
	.page-link {
		max-width: 300px;
		margin: auto;
		background: #ECC440;
		padding: 2rem 0;
	}
	.page-link a {
		display: block;
		text-align: center;
		font-size: 2.4rem;
		width: 70%;
		margin: auto;
	}
	.page-link:hover a{
		border-bottom: 1px solid #fff;
	}
	
	.sp-only {
		display: block;
	}
	.g-nav {
		display: none;
	}
	.pc-only {
		display: none;
	}
	/*------- ヘッダー -------*/
	#header {
		width: 95%;
		justify-content: center;
		position: absolute;
		top:0;
		left: 50%;
		transform: translate(-50%);
		z-index: 2;
	}
	.head-logo {
		max-width: 240px;
	}
	.head-logo a {
		display: block;
	}
	.head-bnrs {
		gap: 3rem;
		display: none;
	}
	.head-bnrs .tel-bnr {
		max-width: 200px;
	}
	.tel-bnr a {
		display: block;
		text-align: center;
		font-size: 3rem;
	}
	.head-bnrs .web-bnr {
		max-width: 200px;
	}
	.web-bnr a {
		display: block;
		text-align: center;
		font-size: 3rem;
	}
	.tel-bnr a i,
	.web-bnr a i {
		margin-right: 1rem;
		font-size: 2.6rem;
	}

/*採用情報バナー*/
	.recruit_bnr {
        left: 10px;
        bottom: 75px;
        padding: 20px 50px 20px 20px;
    }
	.recruit_bnr img {
        display: none;
    }

	/*メインビジュアル*/
	.mainvisual {
		width: 100%;
		height: 50vh;
		background:url("../img/sp-mv.png");
		background-size: cover;
		margin-bottom: 25rem;
	}
	.catch-copy {
		position: absolute;
		top:60%;
		left: 50%;
		transform: translate(-50%);
		background: url("../img/bg07.png");
		background-size: cover;
		padding: 1rem 0;
		width: 330px;
	}
	.catch-copy h2 {
		width: 90%;
		margin: auto;
		text-align: center;
		font-size: 3rem;
		line-height: 1.5;
		border-bottom: 1px solid #ccc;
	}
	.catch-copy h3 {
		text-align: center;
		font-size: 2rem;
		margin-top: 2rem;
		line-height: 1.5;
		position: relative;
	}
	.catch-copy h3::before {
		content: "";
		width: 80px;
		height: 65px;
		background: url("../img/deco15.png");
		background-size: cover;
		position: absolute;
		top:-5px;
		right: -30px;
	}
	.mv-bnr-wrapper {
		position: absolute;
		top:55rem;
		left: 50%;
		transform: translateX(-50%);
		width: 80%;
	}
	.mv-bnr-wrapper a {
		display: block;
		margin-bottom: 3rem;
	}
	
	
	
	
	/*------- お知らせ・カレンダー -------*/
	#news-calendar {
		padding: 5rem 0 5rem 0;
		background: url("../img/deco01.png")left 0% top 0% / 40% auto no-repeat,
			url("../img/deco02.png") right 0% top 0% / 40% auto no-repeat;
	}
	#news-calendar .inner {
		max-width: 390px;
		margin: auto;
		flex-direction: column;
		gap:5rem;
	}
	.news .ttl,
	.calendar .ttl {
		width: 15rem;
		margin: auto;
	}
	.nc-box {
		border: dashed 1px #5BC7D8;
		padding: 3rem 0;
		box-sizing: border-box;
	}
	.news dl dd {
	flex-direction: column;
		gap:1rem;
}
.news dl dd .thumbnail {
	width: 80%;
}
.news dl dd .content {
	width: 100%;
	padding-left: 0rem;
	box-sizing: border-box;
}
	
	
	
	/*------- 感染症対策*-------*/

	#covid19 {
		padding: 5rem 0;
	}
	.accordion-001 {
		max-width: 390px;
	}
	
	
	/*-------- かかりつけ医 --------*/
	#top-prevention {
		padding: 10rem 0;
	}
	.top-message {
		width: 95%;
		margin: auto;
	}
	.top-message h4 {
		text-align: center;
		font-size: 2.8rem;
		line-height: 1.5;
		position: relative;
	}
	.top-message h4::before {
		content: "";
		width: 60px;
		height: 52px;
		background: url("../img/deco03.png");
		background-size: cover;
		position: absolute;
		top: -3rem;
		left: 1rem;
	}
	.top-message h4::after {
		content: "";
		width: 60px;
		height: 52px;
		background: url("../img/deco04.png");
		background-size: cover;
		position: absolute;
		top: 8rem;
		right: 1rem;
	}

	#top-prevention .inner {
		width: 90%;
		margin: 5rem auto;
		flex-direction: column;
		gap:5rem;
	}
	#top-prevention .inner .left {
		width: 100%;
		background: #C9E4F8;
		padding: 2rem 0;
		position: relative;
	}
	#top-prevention .inner .left::before {
		content: "PREVENTION";
		color: #1B6DCB;
		font-size: 2rem;
		transform: rotate(0deg);
		position: absolute;
		top: -3rem;
		left: 0rem;
	}
	#top-prevention .inner .right {
		width: 100%;
	}
	#top-prevention .inner .right .b-txt {
		font-size: 2.8rem;
		margin-bottom: 2rem;
		text-align: center;
	}
	#top-prevention .inner .right .s-txt {
		text-align: left;
		font-size: 2.4rem;
	}
	.topic01 {
		position: relative;
	}
	.topic01::before {
		content:"";
		width: 40px;
		height:35px;
		background: url("../img/deco05.png");
		background-size: cover;
		position: absolute;
		top: -2rem;
		left: 40%;
	}
	.topic01::after {
		content:"";
		width: 40px;
		height:35px;
		background: url("../img/deco06.png");
		background-size: cover;
		position: absolute;
		bottom: 1rem;
		right: 2rem;
	}
	.topic02 {
		position: relative;
	}
	.topic02::before {
		content:"";
		width: 40px;
		height:35px;
		background: url("../img/deco05.png");
		background-size: cover;
		position: absolute;
		top: -2rem;
		left: 40%;
	}
	.topic02::after {
		content:"";
		width: 40px;
		height:35px;
		background: url("../img/deco06.png");
		background-size: cover;
		position: absolute;
		bottom: -1rem;
		left: 2rem;
	}
	#top-prevention .inner .left .topic .topic-pic {
		width: 40%;
	}
	#top-prevention .inner .left .topic .topic-ttl {
		width: 60%;
		padding: 2rem 0;
	}
	
	
	#movie {
			padding: 5rem 0 8rem 0;
		}
		.movies {
			width: 90%;
			margin: auto;
			flex-direction: column;
			gap:3rem;
		}
		.movielink {
			width: 100%;
		}
		.movielink a {
			display: block;
		}

	/*-------- 特徴 --------*/
	#feature {
		padding: 5rem 0;
		background:rgba(245,221,222,0.60);
	}
	.feature-wrapper {
		flex-direction: column;
		gap: 5rem;
	}
	.while-bar {
		width: 95%;
		margin: 3rem auto;
	}
	.feature-item {
		width: 90%;
		margin: auto;
		flex-direction: column;
		gap:6rem;
	}
	.feature-pic,
	.feature-txt {
		width: 100%;
	}
	.feature-txt h5 {
		color: #7D7D7D;
		font-size: 2.8rem;
		margin-bottom: 2rem;
		text-align: center;
	}
	.feature-txt h5 span {
		font-size: 4rem;
	}
	.feature-txt p {
		font-size: 2.2rem;
		line-height: 2;
	}
	.feature01 {
		position: relative;
	}
	.feature01::before {
		content: "";
		width: 80px;
		height: 100px;
		background: url("../img/deco09.png");
		background-size: cover;
		position: absolute;
		top: -16rem;
		right: 1rem;
	}
	.feature02 {
		position: relative;
	}
	.feature02::before {
		content: "";
		width: 90px;
		height: 100px;
		background: url("../img/deco10.png");
		background-size: cover;
		position: absolute;
		top: -14rem;
		left: 1rem;
	}
	.feature03 {
		width: 100%;
	}
	.feature03-2 {
		padding-top: 0rem;
		position: relative;
	}
	.feature03-2::before {
		content: "";
		width: 80px;
		height: 90px;
		background: url("../img/deco11.png");
		background-size: cover;
		position: absolute;
		top: -3rem;
		right: -1rem;
	}
	.feature03-2::after {
		content: "";
		width: 70px;
		height: 70px;
		background: url("../img/deco12.png");
		background-size: cover;
		position: absolute;
		bottom: -5rem;
		left: -2rem;
	}
	#feature .page-link {
		margin-top: 5rem;
	}
	
	
	/*-------- ご挨拶 --------*/
	#greeting {
		background: url("../img/bg06.jpg");
		background-size: cover;
		background-position: center;
	}
	#greeting .inner {
		width: 100%;
		margin: auto;
		padding: 5rem 0 ;
		background: rgba(251,243,212,0.8);
	}
	.greeting-ttl {
		width: 150px;
		height: 150px;
		border-radius: 50%;
		margin: auto;
		background: #ECC440;
		position: relative;
	}
	.greeting-ttl h6 {
		font-size: 3rem;
		text-align: center;
		line-height: 150px;
	}
	.greeting-ttl::before {
		content: "";
		width: 80px;
		height: 80px;
		background: url("../img/deco13.png");
		background-size: cover;
		position: absolute;
		top: 5rem;
		left: -12rem;
	}
	.greeting-ttl::after {
		content: "";
		width: 70px;
		height: 80px;
		background: url("../img/deco14.png");
		background-size: cover;
		position: absolute;
		top: -5rem;
		right: -12rem;
	}
	.greeting-txt {
		width: 90%;
		margin: 5rem auto;
	}
	.greeting-txt p {
		text-align: left;
		font-size: 2.2rem;
		line-height: 2;
	}
	.greeting-name {
		width: 70%;
		margin: 0 auto 5rem auto;
		border-bottom: 1px solid #ccc;
	}
	.greeting-name p {
		text-align: center;
	}
	.greeting-name .position {
		font-size: 3rem;
	}
	.greeting-name .name {
		font-size: 4rem;
		color: #138273;
	}
	.pl-flex {
		flex-direction: column;
		gap:1rem;
	}
	
	
	/*-------- 設備紹介 --------*/
	#Equipment-introduction {
		padding: 8rem 0;
	}
	.ei-wrapper {
		width: 95%;
		margin: 8rem auto 0 auto;
		justify-content: space-between;
	}
	.ei-wrapper .item {
		width: 100%;
		position: relative;
		margin-bottom: 8rem;
	}
	.ei-wrapper .item .item-card {
		width: 90%;
		background: #fff;
		box-shadow: 2px 2px 5px #ccc;
		padding: 3rem 0;
		position: absolute;
		bottom:-1rem;
		left: 50%;
		transform: translatex(-50%);
	}
	.ei-wrapper .item .item-card p {
		font-size: 18px;
		text-align: center;
		color: rgba(61,43,44,1.00);
	}
	
	/*-------- 診療案内 --------*/
	#medical-sp {
		padding: 5rem 0 0 0;
	}
	.medical-ttl {
		width: 300px;
		height: 120px;
		margin:0 auto 5rem auto;
		padding-top: 3.2rem;
		box-sizing: border-box;
	}
	.medical-ttl h6 {
		text-align: center;
		font-size: 3rem;
	}
	#medical-sp .container {
		width: 100%;
		padding: 1rem 0;
	}
	#medical-sp .container .inner {
		align-items: center;
		gap:3rem;
		flex-direction: column;
	}
	#medical-sp .container .container-ttl {
		width: 30%;
	}
	#medical-sp .container .medical-wrapper {
		width: 100%;
		margin: auto;
		justify-content: center;
		align-items: flex-start;
		gap: 3rem;
	}
	#medical-sp .container .medical-wrapper .medical-item {
		width: 45%;
	}
	#medical-sp .container .medical-wrapper .medical-item a {
		display: block;
		margin-bottom: 2rem;
	}
	#medical-sp .container .medical-wrapper .medical-item p {
		font-size: 14px;
		line-height: 1.5;
		display: none;
	}
	.container01 {
		background: url("../img/bg0.jpg");
		background-size: cover;
	}
	.container03 {
		background: url("../img/bg02.jpg");
		background-size: cover;
	}
	
	/*--- バナーリンク ---*/
	.bnr-space {
		background: url("../img/bg10.png");
		background-size: cover;
	}
	.bnr-space .inner {
		width: 100%;
		margin: auto;
		background: rgba(255,255,255,0.8);
		padding: 5rem 0;
	}
	.bnr-flex {
		width: 80%;
		margin: auto;
		flex-direction: column;
		gap:5rem;
	}
	.bnr-flex .item {
		width: 100%;
		padding: 3rem 0;
	}
	.bnr-flex .item a {
		display: block;
		text-align: center;
		font-size: 3rem;
	}
	/*-------- フッター --------*/
	.foot-top {
		background: url("../img/bg11.png");
		background-size: cover;
		padding: 5rem 0 5rem 0;
	}
	.foot-logo {
		width: 350px;
		margin: auto;
	}
	.foot-icon {
		width: 50px;
		margin: auto;
	}
	.foot-top .inner {
		width: 95%;
		margin: 5rem auto;
		flex-direction: column;
		gap:3rem;
	}
	.foot-top .inner .left,
	.foot-top .inner .right {
		width: 100%;
	}
	.foot-top .inner .left .adress {
		text-align: center;
		font-size: 2.2rem;
	}
	.foot-top .inner .left .foot-bnr {
		justify-content: space-between;
		margin-top: 5rem;
	}
	.foot-top .inner .left .foot-bnr .tel-bnr {
		width: 48%;
		background: url("../img/bg05.jpg");
		padding: 1rem 0;
	}
	.foot-top .inner .left .foot-bnr .web-bnr {
		width: 48%;
		background: url("../img/bg08.jpg");
		padding: 1rem 0;
	}
	.foot-map iframe {
		width: 100%;
	}
	#footer .copy {
		font-size: 14px;
		text-align: center;
		margin: 6px auto;
	}
	#footer {
		margin-bottom: 80px;
	}
	
	#sp-btn {
		position: fixed;
		bottom: 0;
		left: 50%;
		z-index: 980;
    width: 100%;
		transform: translateX(-50%);
	}
	#sp-btn ul {
		justify-content: center;
    max-width: 420px;
    padding-bottom: 0;
    margin: 0 auto;
    position: relative;
	}
	#sp-btn .type1 ul::before {
		background: rgba(76, 190, 227, 0.7);
	}
	#sp-btn ul::before {
		content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    z-index: -1;
		background: rgba(235, 161, 171, 0.9);
		backdrop-filter: blur(2px);
	}
	#sp-btn ul li {
		width: calc(100% / 3);
    margin: 0;
    padding: 10px 0 6px;
    text-align: center;
    line-height: 1.2;
    position: relative;
	}
	#sp-btn ul li a {
		display: block;
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    z-index: 1;
		text-align: center;
	}
	#sp-btn ul li i {
		font-size: 3.6rem;
    font-family: "Font Awesome 5 Free";
    display: block;
    color: #fff;
    font-weight: 600;
    margin-bottom: 3px;
		text-align: center;
	}
	#sp-btn ul li span {
		display: block;
    font-size: 1.8rem;
    color: #fff;
		text-align: center;
	}
	

	/*~~~~~~~~~~ 下層ページ ~~~~~~~~~~*/
	.s-mainvisual {
		height: 30vh;
		background: url("../img/mainvisual.png");
		background-position: center;
		background-size: cover;
		position: relative;
	}
	.page-ttl {
		width: 100%;
		position: absolute;
		top: 60%;
		left: 50%;
		transform: translate(-50%,-50%);
	}
	.page-ttl h2 {
		text-align: center;
		font-size: 3.6rem;
	}
	.page-ttl h2 span {
		font-size: 2.4rem;
		font-family: "Monotype Corsiva";
	}
	.sec-ttl {
		width: 95%;
		margin: 1rem auto;
		border-bottom: 1px solid #F275D1;
		padding-bottom: 0.8rem;
	}
	.sec-ttl h3 {
		margin-left: 13rem;
		font-size: 3.2rem;
		color: #555353;
		position: relative;
	}
	.sec-ttl h3::before {
		content: "";
		width: 12rem;
		height: 3.5rem;
		background: url("../img/deco16.png");
		background-size: cover;
		position: absolute;
		top: -0.3rem;
		left: -13rem;
	}

	.inner-flex {
		width: 95%;
		margin: 3rem auto;
		flex-direction: column;
		gap: 5rem;
	}
	.inner-flex .if-img,
	.inner-flex .if-txt {
		width: 100%;
	}
	.inner-flex02 {
		width: 85%;
		margin: 1rem auto;
		flex-direction: column;
		gap:3rem;
	}
	.inner-flex02 .if-img,
	.inner-flex02 .if-txt {
		width: 100%;
	}
	.inner-flex .if-txt h7 {
		font-size: 2.6rem;
		margin-bottom: 3rem;
	}
	.inner-flex .if-txt p,
	.inner-flex02 .if-txt p {
		font-size: 2.2rem;
		line-height: 2;
	}
	.mini-ttl {
		width: 95%;
		margin: 5rem auto;
		border-bottom: 1px solid #ECC440;
	}
	.mini-ttl p {
		text-align: center;
		color: #ECC440;
		font-size: 2.4rem;
	}
	
	
	/*-------- 院長・スタッフ紹介 --------*/

	/*院長紹介*/
	.doctor-name {
		font-size: 3.2rem;
		margin-top: 2rem;
		margin-left: auto;
		margin-right: auto;
		text-align: center;
	}
	#doctor-intro {
		padding: 5rem 0;
	}
	.career {
		background: rgba(245,248,201,0.8);
		padding: 3rem;
		box-sizing: border-box;
	}
	.career-ttl {
		font-size: 3rem;
		margin-bottom: 2rem;
	}
	.career dl {
		justify-content: space-between;
		align-items: flex-start;
		font-size: 2rem;
	}
	.career dl dt {
		width: 20%;
		padding-bottom: 1rem;
	}
	.career dl dd {
		width: 80%;
		padding-bottom: 1rem;
	}
	.career dl p {
		margin-top: 2rem;
	}
	.doctor-career {
		width: 95%;
		margin: 1rem auto;
	}

	/*sスタッフ紹介*/
	#staff-intro {
		padding: 5rem 0;
	}
	.staff-inner {
		width: 90%;
		margin: 5rem auto;
		flex-direction: column;
		gap: 5rem;
	}
	.staff-img {
		width: 70%;
		margin: auto;
	}
	.staff-name {
		text-align: center;
		font-size: 2.4rem;
		margin-top: 2rem;
	}
	.staff-career {
		width: 100%;
	}
	
	/*-------- 医院紹介 --------*/
	/*初めての方へ*/
		.first-top-message {
			width: 90%;
			margin: 8rem auto;
			flex-direction: column;
			gap:3rem;
	}
	.first-top-message h4 {
		font-size: 22px;
		border-bottom: 1px solid #ffb6c1;
		padding-bottom: 5px;
		margin-bottom: 2rem;
		line-height: 1.5;
	}
	.ftm-img,
	.ftm-txt {
		width: 100%;
	}
	.ftm-txt p {
		font-size: 14px;
		line-height: 2;
		width: 100%;
	}

	/*医院紹介*/
	.commitment {
		padding: 3rem 0;
	}
	.commitment-ttl {
		text-align: center;
		font-size: 2.4rem;
		margin-bottom: 1rem;
	}
	
	
	/*-------- 診療案内 --------*/
	.medical-top {
		width: 100%;
		margin: 5rem auto 5rem auto;
		flex-direction: column;
		gap:0;
	}
	.medical-top .item {
		width: 100%;
		padding: 1rem 0;
		border-radius: 0rem;
	}
	.mt-ttl {
		text-align: center;
		font-size: 3.6rem;
	}
	.mt-ttl span {
		font-size: 6rem;
	}
	.mt-item-flex {
		width: 96%;
		margin: 2rem auto 0 auto;
		justify-content: center;
		gap: 2rem;
	}
	.mt-item-flex {
		width: 96%;
		margin: 1rem auto 0 auto;
		justify-content: center;
		gap: 2rem;
	}
	.mt-link {
		width: 45%;
		background: #fff;
		padding: 2rem 0;
		border-radius: 3rem;
	}
	.mt-link a {
		display: block;
		text-align: center;
		font-size: 2.6rem;
		color: #7D7D7D;
	}
	.mt-link:hover {
		background:rgba(245,217,232,1.00);
	}
	.medical-content {
		padding: 5rem 0;
	}

	/*歯周病治療*/
	.pc-txt {
		width: 90%;
		margin: auto;
		font-size: 2rem;
		line-height: 2;
	}

	/*治療の流れ*/
	.medical-flow {
		width: 90%;
		margin: auto;
		padding: 8rem 0 0 0;
	}
	.mf-ttl {
		width: 70%;
		margin: auto;
		padding: 2rem 0;
		border-top: 1px solid #ECC440;
		border-bottom: 1px solid #ECC440;
	}
	.mf-ttl p {
		text-align: center;
		font-size: 3rem;
	}
	.flow-wrapper {
		padding: 5rem 0;
		flex-direction: column;
		gap: 5rem;
	}
	.flow-item {
		border:1px solid #ECC440;
	}
	.flow-ttl {
		background: #F5F8C9;
		padding: 1rem 0;
	}
	.flow-ttl p {
		font-size: 2.4rem!important;
		margin-left: 120px;
	}
	.flow-txt {
		width: 90%;
		margin: auto;
		padding: 3rem 0;
	}
	.flow-txt p {
		font-size: 2rem;
		line-height: 2;
	}
	.flow01 {
		position: relative;
	}
	.flow01::before {
		content:"01";
		font-family: "貂明朝";
		color: #fff;
		font-size: 4.6rem;
		width: 80px;
		height: 80px;
		border-radius: 50%;
		line-height: 80px;
		background: url("../img/bg05.jpg");
		text-align: center;
		position: absolute;
		top:0px;
		left: 10px;
	}
	.flow02 {
		position: relative;
	}
	.flow02::before {
		content:"02";
		font-family: "貂明朝";
		color: #fff;
		font-size: 4.6rem;
		width: 80px;
		height: 80px;
		border-radius: 50%;
		line-height: 80px;
		background: url("../img/bg05.jpg");
		text-align: center;
		position: absolute;
		top:-20px;
		left: 10px;
	}
	.flow03 {
		position: relative;
	}
	.flow03::before {
		content:"03";
		font-family: "貂明朝";
		color: #fff;
		font-size: 4.6rem;
		width: 80px;
		height: 80px;
		border-radius: 50%;
		line-height: 80px;
		background: url("../img/bg05.jpg");
		text-align: center;
		position: absolute;
		top:-20px;
		left: 10px;
	}
	.flow04 {
		position: relative;
	}
	.flow04::before {
		content:"04";
		font-family: "貂明朝";
		color: #fff;
		font-size: 4.6rem;
		width: 80px;
		height: 80px;
		border-radius: 50%;
		line-height: 80px;
		background: url("../img/bg05.jpg");
		text-align: center;
		position: absolute;
		top:-20px;
		left: 10px;
	}

	/*小児歯科*/
	.commitment-wrapper {
		width: 100%;
		margin: 5rem auto 0 auto;
	}
	
	#kids .flow01::before {
		content:"01";
		font-family: "貂明朝";
		color: #fff;
		font-size: 4.6rem;
		width: 80px;
		height: 80px;
		border-radius: 50%;
		line-height: 80px;
		background: url("../img/bg05.jpg");
		text-align: center;
		position: absolute;
		top:-10px;
		left: 10px;
	}
	
	/*-------- 採用情報 --------*/
	#recruit {
		padding: 10rem 0 0 0;
	}
	#recruit .bottom-message {
		width: 100%;
		margin: 5rem auto;
	}
	#recruit .bottom-message p {
		font-size: 2.2rem;
		text-align: center;
		line-height: 2;
	}
	#recruit .bottom-message .tel-bnr {
		width: 300px;
		margin: 3rem auto;
		background: url("../img/bg05.jpg");
		background-size: cover;
		padding: 1rem 0;
	}


	/*-------- 診療時間・アクセス --------*/ 
	/*診療時間*/
	#hours {
		padding: 5rem 0;;
	}
	#hours .if-txt {
		text-align: center;
	}
	#hours .if-txt img {
		width: 80%;
		margin: 2rem auto;
	}
	#hours .if-txt p {
		text-align: center;
	}
	#hours .if-txt a {
		display: block;
		color: #ECC440;
		font-size: 3.6rem;
		text-align: center;
	}
	#hours .if-txt a i {
		font-size: 2rem;
		margin-right: 1rem;
	}
	.time-table {
		width: 90%;
		margin: 5rem auto 0 auto;
	}

	/*アクセス*/
	#access {
		padding: 5rem 0;
	}
	.access-map {
		width: 90%;
		margin: 5rem auto;
	}
	.access-map iframe {
		width: 100%;
		height: 250px;
	}
	.access-car {
		margin-bottom: 5rem;
	}
	.access-txt {
		font-size: 2rem;
		text-align: center;
		line-height: 2;
		margin: 3rem auto;
	}
	.access-images {
		width: 80%;
		margin: auto;
		flex-direction: column;
		gap:1rem;
	}
	.access-images img {
		width: 100%;
	}

	body > main > div:nth-child(2)
	{
		margin: 70px 0px 200px !important;
	}

	body > main > div.mainvisual,
	body > main > div.s-mainvisual
	{
		margin-top: 70px;
	}
	
}