@charset "utf-8";
/* CSS Document */
@media screen and (max-width:768px){
	html {
		font-size: 8px;
	}
	body {
		max-width: 768px;
	}
	
	/*----------------------------------------------------*/
	.mainvisual {
		height: 50vh;
	}
	.mainvisual h1 {
		position: absolute;
		top: 2rem;
		right: 2rem;
		width: calc(100% - 50%);
	}
	.mainvisual .worries {
		position: absolute;
		top: 18rem;
		right: 1rem;
		width: calc(100% - 35%);
	}
	.worries-ttl {
		width: 70%;
		margin: 0 auto 1rem auto;
	}
	.worries-box {
		background: linear-gradient(#DDDCD8,#ffffff,#DDDCD8);
		padding: 3rem 0 1rem 0;
		border-radius: 3rem;
	} 
	.worries-box ul {
		width: 98%;
		margin: auto;
		justify-content: center;
		gap: 1%;
	}
	.worries-box ul li {
		width: 49%;
		background: #fff;
		padding: 1rem 0;
		margin-bottom: 2rem;
		box-shadow: 2px 2px 3px #c0c0c0;
		border-radius: 1rem;
	}
	.worries-box ul li:hover {
		box-shadow: none;
		background: #c0c0c0;
	}
	.worries-box ul li a {
		display: block;
		font-size: 1.4rem;
		margin-left: 1rem;
		color: #333;
	}
	
	/*ヘッダー*/
	.head-bar {
		display: flex;
		justify-content: space-between;
		padding: 1rem;
		background: #fff;
	}
	.head-left h1 {
		width: 24rem;
		margin-bottom: 1rem;
	}
	.head-left h1 a {
		display: block;
	}
	.head-left p {
		font-size: 4px;
		letter-spacing: 0.1rem;
	}
	.head-tel {
		display: flex;
		justify-content: flex-end;
	}
	.telbnr {
		width: 24rem;
		padding: 0.8rem;
		background:linear-gradient(to bottom, #29729C, #E6F0F6);
		border-radius: 2rem;
	}
	.telbnr a {
		display: block;
		color: #fff;
		font-size: 2.8rem;
		text-align: center;
		font-weight: 600;
	}
	.telbnr a i {
		margin-right: 1rem;
	}

	.head-right ul {
		margin-top: 1.6rem;
		display: flex;
		gap: 2rem;
	}
	.head-right ul li {
		font-size: 1.4rem;
		letter-spacing: 0.1rem;
	}
	.head-right ul li a {
		display: block;
		color: #333;
	}
	.head-right ul li a:hover {
		color: #ccc;
	}
	
	/*金属アレルギーになる歯科材料*/
	#material {
		padding-top: 8rem;
		padding-bottom: 10rem;
	}
	.top-sectitle {
		text-align: center;
		font-size: 4.8rem;
		font-weight: 600;
		margin-bottom: 5rem;
	}
	.mate-flex {
		width: 90%;
		margin: auto;
		justify-content: space-between;
	}
	.mate-img {
		width: 48%
	}
	.mate-txt {
		width: 48%;
	}

	/*金属を使用されている方へ*/
	#menu {
		background-image: url("../img/bg01.jpg");
		background-size: cover;
		padding: 5rem 0;
	}
	.menu-message {
		text-align: center;
		font-size: 3.6rem;
	}
	.bgtxt-b {
		font-size: 6rem;
		color: #1465CF;
		font-weight: 600;
	}
	.menu-wrapper {
		width: 95%;
		margin: 5rem auto;
		display: flex;
		justify-content: space-between;
	}
	.menu-item {
		width: 33%;
		position: relative;
		padding: 1rem 3rem;
	}
	.menu-item::before {
		 content: "";
		 display: block;
		 height: 95%;
		 width: 0;
		 border-right: 0.2rem solid #a9a9a9;
		 position: absolute;
		 left: 0;
		 top: 5rem;
		 margin: auto;
	}
	.menu-item:first-of-type::before{
			content: none;
	}
	.menu-title {
		text-align: center;
		font-size: 2rem;
		margin-bottom: 1rem;
		border-top: 0.2rem solid #a9a9a9;
		padding-top: 5rem;
	}
	.bgtxt-0 {
		font-size: 3rem;
		font-weight: 600;
	}
	.detail {
		width: 70%;
		margin: 2rem auto;
		background: linear-gradient(to top,#E2E2DA,#5A97E9);
		padding: 1rem 0;
		border-radius: 2rem;
		box-shadow: 0rem 0.5rem 0.1rem #ccc;
	}
	.detail a {
		display: block;
		text-align: center;
		font-size: 2rem;
		color: #fff;
	}
	.detail:active {
		box-shadow: none;
		position: relative;
		top: 0.5rem;
	}

	/*ドクター*/
	#doctor {
		padding: 10rem 0;
		color: #052147;
	}
	.doc-flex {
		width: 95%;
		margin: 0 auto;
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
		gap: 2%;
		align-items: center;
	}
	.doc-left,
	.doc-right {
		width: 48%;
	}
	.bgtxt-n {
		font-size: 5rem;
		font-weight: 600;
	}
	.plus {
		font-size: 3rem;
		margin: 1.6rem 0;
	}
	.fs30 {
		font-size: 3rem;
	}
	.doc-name {
		font-size: 4.2rem;
		font-weight: 600;
		margin-top: 1rem;
	}
	.readmore {
		margin-top: 3rem;
		width: 70%;
		background: linear-gradient(to top,#E6F0F6,#29729C);
		padding: 1rem 0;
		border-radius: 2rem;
		box-shadow: 0rem 0.5rem 0.1rem #ccc;
	}
	.readmore a {
		display: block;
		color: #fff;
		font-size: 3rem;
		font-weight: 600;
		text-align: center;
		letter-spacing: 0.1rem;
	}
	.readmore:active {
		box-shadow: none;
		position: relative;
		top: 0.5rem;
	}

	/*特徴*/
	#features {
		background-image: url("../img/bg02.jpg");
		background-size: cover;
		padding: 10rem 0;
		color: #052147;
	}
	.feature {
		width: 95%;
		margin: 5rem auto;
		background-color: #fff;
		padding: 4rem 0;
	}
	.feature-inner {
		width: 95%;
		margin: auto;
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
		align-items: center;
	}
	.feature-img {
		width: 50%;
	}
	.feature-img img {
		width: 90%;
	}
	.feature-txt {
		width: 48%;
	}
	.feature-title {
		font-size: 3rem;
		font-weight: 600;
	}
	.feature-p{
		width: 90%;
		font-size: 1.8rem;
		line-height: 2;
	}
	.f-plus {
		font-size: 3.6rem;
		margin: 2rem 0;
	}

	/*お知らせ*/
	#news {
		background: #fff;
		padding: 5rem 0;
	}
	.news-inner {
		width: 95%;
		margin: auto;
		border-top: 0.8rem solid #537BB0;
		border-bottom: 0.8rem solid #537BB0;
		padding: 5rem 0;
	}
	.bgtxt-ns {
		font-size: 7.2rem;
		font-weight: 600;
		color: #052147;
		text-align: center;
	}
	.news-box {
		height: 30rem;
		width: 90%;
		margin: auto;
		background: #fff;
		box-shadow: 10px 5px 5px #ccc;
		padding: 3rem 0;
	}
	.news-item {
		width: 80%;
		margin: auto;
		display: flex;
		align-items: center;
		gap: 3rem;
		border-bottom: 1px solid #ccc;
		padding-bottom: 2rem;
	}
	.day {
		font-size: 2rem;
		color: #052147;
	}
	.news-title {
		font-size: 2rem;
	}

	/*フッター*/
	#footer {
		background: linear-gradient(to top, #D8D9DA,#EBF2F2);
		padding-top: 3rem;
		padding-bottom: 1rem;
	}
	.footer-menu ul {
		width: 80%;
		margin: 0 auto 3rem auto;
		display: flex;
		justify-content: center;
		gap: 3rem;
	}
	.footer-menu ul li {
		font-size: 1.6rem;
	}
	.footer-info {
		width: 80%;
		margin: auto;
		text-align: center;
	}
	.footer-info img {
		width: 50%;
	}
	.f-adress {
		font-size: 1.4rem;
		text-align: center;
		margin: 2rem auto 1rem auto;
		letter-spacing: 0.2rem;
	}
	.f-tel {
		font-size: 2.4rem;
		text-align: center;
		font-weight: 600;
		margin-bottom: 1rem;
	}
	.f-tel i {
		color: #1485CF;
		margin-right: 1rem;
	}
	.map iframe {
		width: 100% !important;
		height: 30rem !important;
	}
	.footer-copy {
		margin-top: 1rem;
	}
	.footer-copy p {
		text-align: center;
		line-height: 2;
	}

	/*===== 下層ページ =====*/
	/*ヘッダー*/
	#s-header {
		margin-bottom: 5rem;
	}
	.s-head-bar {
		display: flex;
		justify-content: space-between;
		padding: 1rem;
		background: #fff;
		box-shadow: 0 2px 2px #c0c0c0;
	}
	.s-head-left h1 {
		width: 36rem;
		margin-bottom: 1rem;
	}
	.s-head-left h1 a {
		display: block;
	}
	.s-head-left p {
		font-size: 1.2rem;
		letter-spacing: 0.1rem;
	}
	.s-head-tel {
		display: flex;
		justify-content: flex-end;
	}
	.s-telbnr {
		width: 24rem;
		padding: 0.8rem;
		background:linear-gradient(to bottom, #29729C, #E6F0F6);
		border-radius: 2rem;
	}
	.s-telbnr a {
		display: block;
		color: #fff;
		font-size: 2.8rem;
		text-align: center;
		font-weight: 600;
	}
	.s-telbnr a i {
		margin-right: 1rem;
	}


	.container {
		justify-content: space-between;
	}
	/*サイドバー*/
	.container aside {
		width: 20%;
	}
	.side-nav {
		width: calc(100% - 10%);
		margin: auto;

	}
	.side-nav .nav-ttl {
		text-align: center;
		font-size: 3.6rem;
		letter-spacing: 3px;
		margin-bottom: 3rem;
	}
	.side-nav-list {
		width: 100%;
		margin: auto;
		flex-direction: column;
		gap: 1rem;
	}
	.side-nav-list li {
		background: #fff;
		box-shadow: 3px 3px 2px #c0c0c0;
		padding: 1rem 0;
	}
	.side-nav-list li a {
		display: block;
		text-align: center;
		font-size: 1.8rem;
		color: #333;
	}
	.side-nav-list li:last-child {
		margin-top: 3rem;
	}

	.accordion-001 {
			max-width: 500px;
			background-color: #fafdff;
	}

	.accordion-001:not([open]) {
			margin-bottom: 7px;
	}

	.accordion-001 summary {
			display: flex;
			width: 80%;
		margin: 0 auto;
			justify-content: space-between;
			align-items: center;
			position: relative;
			padding: 1rem 0;
			border-radius: 0px;
			background-color: #ffffff;
			color: #333;
			font-weight: 600;
			cursor: pointer;
			text-align: center;
			font-size: 1.6rem;
	}

	.accordion-001 summary::-webkit-details-marker {
			display: none;
	}

	.accordion-001 summary::after {
			transform: translateY(-25%) rotate(45deg);
			width: 7px;
			height: 7px;
			margin-left: 0px;
			border-bottom: 3px solid #333;
			border-right: 3px solid #333;
			content: '';
			transition: transform .3s;
	}

	.accordion-001[open] summary::after {
			transform: rotate(225deg);
	}

	.side-nav-in {
			transform: translateY(-10px);
			opacity: 0;
			margin: 0;
			padding: 1em 0 2em 0;
			color: #333333;
			transition: transform .5s, opacity .5s;
	}
	.side-nav-in li {
		width: 95%;
		margin-left: auto;
		margin-right: auto;
		box-shadow: none;
		margin-bottom: 1rem;
		border-bottom: 1px solid #c0c0c0;
	}
	.side-nav-in li a {
		width: 95%;
		margin: auto;
		font-size: 1.6rem;
		text-align: left;
	}

	.accordion-001[open] .side-nav-in {
			transform: none;
			opacity: 1;
	}


	/*メイン*/
	.container article {
		width: 80%;
	}
	.container article .inner {
		width: 100%;
		margin: auto;
	}
	.Topnav {
		width: calc(100% - 20%);
		margin: 0 auto 5rem auto;
		padding-bottom: 1rem;
		border-bottom: 2.4px dashed #c0c0c0;
	}
	.Topnav ul {
		justify-content: center;
		gap: 5%;
	}
	.Topnav ul li a {
		display: block;
		font-size: 1.6rem;
		color: #3D3C3C;
	}
	.sec-ttl {
		width: calc(100% - 20%);
		margin: auto;
		padding: 2rem 0;
		background: linear-gradient(#CDEFF3,#EBECEC);
	}
	.sec-ttl p {
		text-align: center;
		color: #052147;
		font-size: 5rem;
		font-weight: 600;
	}
	.ttl02 {
		width: calc(100% - 10%);
		margin: 5rem auto 8rem auto;
		position: relative;
		padding: 0.3rem 0;
		border-bottom: 2px solid;
		color: #707070;
		font-weight: bold;
		font-size: 26px;
		text-align: center;
	}
	.ttl02:before,
	.ttl02:after {
			position: absolute;
			top: 100%;
			left: 50%;
			content: "";
			height: 0;
			width: 0;
	}
	.ttl02:before {
			border: 8px solid;
			border-color: transparent;
			border-top-color: #707070;
			margin-left: -8px;
	}
	.ttl02:after {
			border: 5px solid;
			border-color: transparent;
			border-top-color: white;
			margin-left: -5px;
	}
	.ttl02 p {
		color: #052147;
		text-align: center;
		font-size: 4.2rem;
		letter-spacing: 3px;
	}


	/*歯科医師の紹介*/
	.doctor-intro {
		padding: 3rem 0;

	}
	.doctor-in {
		width: calc(100% - 10%);
		margin: 5rem auto;
		justify-content: space-between;
		align-items: center;
	}
	.doctor-in-left {
		width: 48%;
	}

	.doctor-in-left .bgtxt-n {
		font-size: 6rem;
		font-weight: 600;
	}
	.doctor-in-left .plus {
		font-size: 3.6rem;
		margin: 1rem 0;
	}
	.fs30 {
		font-size: 2rem;
	}
	.doctor-in-left .doc-name {
		font-size: 4.2rem;
		font-weight: 600;
		margin-top: 1rem;
	}
	.doc-name span {
		font-size: 2rem;
	}
	.doctor-in-left .doc-name {
		font-size: 3.6rem;
		font-weight: 600;
		margin-top: 1rem;
		line-height: 1;
	}
	.doctor-in-right {
		width: 50%;
	}
	.doctor-message {
		width: calc(100% - 14%);
		margin: 3rem auto;
	}
	.in-txt {
		font-size: 1.8rem;
		color: #052147;
		line-height: 2.5;
	}

	/*院長紹介*/
	.career-in {
		width: calc(100% - 25%);
		margin: 3rem auto;
		color: #052147;
	}
	.career-in .ttl {
		width: 100%;
		margin-top: 2rem;
		margin-bottom: 2rem;
		border-bottom: 1px solid #ccc;
	}
	.career-in .ttl p {
		font-size: 4rem;
	}
	.career-in dl {
		width: 100%;
		font-size: 2rem;
	}
	.career-in dl dt {
		width: 15%;
		padding: 0.8rem 0 0.8rem 1rem;
		box-sizing: border-box;
		border-bottom: 0.8px solid #D1CECE;
	}
	.career-in dl dd {
		width: 85%;
		padding: 0.8rem 0;
		border-bottom: 0.8px solid #D1CECE;
	}
	.career-in-flex {
		width: 100%;	
		justify-content: space-between;
	}
	.career-in-flex ul {
		width: 48%;
	}
	.career-in-flex ul li {
		font-size: 1.8rem;
		list-style-type: square;
		list-style-position: inside;
		padding: 0.8rem 0;
	}

	/*医院紹介*/
	.clinic-intro {
	}
	.clinic-in {
		width: 100%;
		padding: 5rem 0;
		margin: auto;
		justify-content: space-between;
		gap: 3%;
		align-items: center;
	}
	.clinic-item {
		width: 48%;
		color: #052147;
	}
	.item-name {
		font-size: 2.4rem;
		font-weight: 600;
		text-align: center;
		letter-spacing: 1rem;
	}
	.item-txt {
		font-size: 14px;
		line-height: 2;
	}

	/*治療の流れ*/
	.flow {
		padding: 5rem 0;
	}
	.flow-wrapper {
		width: 80%;
		margin: 5rem auto 0 auto;
	}
	.flow-item {
		padding: 2rem 0;
		box-shadow: 2px 2px 2px #ccc;
		margin-bottom: 5rem;
	}
	.flow-item:last-child {
		margin-bottom: 1rem;
	}
	.flow-item-in {
		width: 95%;
		margin: auto;
		justify-content: space-between;
	}
	.flow-left {
		width: 10%;
	}
	.flow-no {
		width: 6rem;
		height: 6rem;
		border-radius: 50%;
		background: #073756;
		margin: auto;
	}
	.flow-no p {
		color: #fff;
		line-height: 6rem;
		text-align: center;
		font-size: 3.6rem;
	}
	.flow-content {
		width: 85%;
	}
	.flow-ttl {
		border-bottom: 1px solid #ccc;
		margin-bottom: 2rem;
	}
	.flow-ttl p {
		color: #073756;
		font-size: 3rem;
		font-weight: 600;
	}
	.flow-txt {
		font-size: 1.8rem;
		line-height: 2;
	}

	/*医院情報*/
	.clinic-info {
		padding: 5rem 0;
		margin-bottom: 5rem;
	}
	.clinic-in {
		width: 95%;
		margin: 5rem auto;
		justify-content: space-between;
		align-items: center;
	}
	.clinic-left {
		width: 45%;
	}
	.clinic-left dl {
		font-size: 1.8rem;
	}
	.clinic-left dl dt {
		width: 30%;
		text-align: center;
		border-bottom: 1px solid #ccc;
		padding: 1rem 0;
		font-weight: 600;
	}
	.clinic-left dl dd {
		width: 70%;
		border-bottom: 1px solid #ccc;
		padding:1rem 0;
		line-height: 2;
	}
	.clinic-right {
		width: 45%;
	}
	.time-table {
		width: 85%;
		margin: auto;
	}



	/*----- 治療について -----*/
	.s-aboout {
		padding-top: 5rem;
	}
	.s-aboout .ttl02 {
		margin-bottom: 0;
	}
	.s-aboout .pic {
		width: 60%;
		margin: 2rem auto;
	}
	.s-aboout .txt-box {
		width: 85%;
		margin: auto;
	}

	.s-materia{
		padding-top: 5rem;
	}
	.s-material .txt-box {
		width: 85%;
		margin: 5rem auto;
	}
	.ma-wrapper {
		flex-direction: column;
		gap: 5rem;
		padding: 5rem 0;
		margin-bottom: 10rem;
	}

	.ma-item {
		width: 85%;
		margin: auto;
		padding: 3rem 0;
		color: #073756;
		background: #fff;
		box-shadow: 2px 2px 3px #ccc;
	}
	.ma-in {
		width: 90%;
		margin: auto;
	}
	.ma-ttl {
		text-align: center;
		font-size: 3rem;
		font-weight: 600;
		margin-bottom: 2rem;
	}
	.ma-txt {
		width: 90%;
		margin: auto;
		font-size: 1.8rem;
		line-height: 2;
	}
	.ma-feature {
		width: 80%;
		margin: 3rem auto;
		background: #D6ECF8;
		padding: 2rem 0;
	}
	.mf-ttl {
		text-align: center;
		font-size: 2.2rem;
		font-weight: 600;
	}
	.ma-feature ul {
		width: 90%;
		margin: 2rem auto;
	}
	.ma-feature ul li {
		font-size: 1.6rem;
		padding: 1rem;
		list-style: disc;
		list-style-position: inside;
	}

	/*入れ歯*/
	#dentures {
		margin-bottom: 10rem;
	}

	/*アレルギー*/
	#allergy {
		margin-bottom: 10rem;
	}
	.symptoms .txt-box {
		margin: 8rem auto;
	}
	.symptoms-wrapper {
		flex-direction: column;
		gap: 5rem;
	}
	.symptoms-box {
		width: 85%;
		margin: auto;
		padding: 3rem 0;
		color: #073756;
		background: #fff;
		box-shadow: 2px 2px 3px #ccc;
	}
	.symptoms-ttl {
		text-align: center;
		font-size: 3rem;
		font-weight: 600;
	}
	.symptoms-in {
		width: 90%;
		margin: auto;
		flex-direction: column;
	}
	.symptoms-in .left,
	.symptoms-in .right {
		width: 85%;
		margin: auto;
	}
	.navy-box {
		width: 80%;
		margin: 8rem auto;
		padding: 3rem 0;
		background: rgba(6,37,58,0.8);
	}
	.navy-box-in {
		width: 90%;
		margin: auto;
		border: 1px solid #fff;
		padding: 4rem;
		box-sizing: border-box;
	}
	.in-txt02 {
		color: #fff;
		line-height: 2;
		font-size: 2rem;
		text-align: center;
		letter-spacing: 3px;
	}


	/*メタルフリー治療*/
	#metalfree {
		margin-bottom: 20rem;
	}
	.metalfree-wrapper {
		width: 90%;
		padding: 5rem 0;
		margin: 5rem auto;
		flex-direction: column;
		gap: 5rem;
	}
	.metalfree-item-in {
		width: 100%;
		margin: auto;
		position: static;
		display: flex;
		flex-direction: column;
	}
	.m-in-img {
		width: 70%;
		margin-left: auto;
		margin-right: auto;
	}
	.m-in-txt {
		position: static;
		width: 100%;
	}
	.m-in-txt p,
	.m-in-txt02 p {
		font-size: 1.8rem;
		line-height: 2;
	}
	.m-in-img02 {
		width: 70%;
		margin-left: auto;
		margin-right: auto;
	}
	.m-in-txt02 {
		position: static;
		width: 100%;
	}

	/*-----Q&A-----*/

	.qa-wrapper {
		padding: 10rem 0;
	}
	.qa-container {
		width: calc(100% - 10%);
		margin: auto;
		padding: 5rem 0;
	}


	h3 {
		position: relative;
		text-align: center;
		font-size: 3rem;
		font-weight: 600;
		padding-bottom: 1rem;
	}
	h3:before {
		position: absolute;
		bottom: -10px;
		left: 50%;
		transform: translate(-50%);
		width: 70rem;
		height: 5px;
		content: '';
		background:linear-gradient(to right, #052147, #CDEFF3);
	}
	.answer-box {
		width: calc(100% - 5%);
		margin: 8rem auto;
		background: linear-gradient(#bbe2f1,#ccffff);
		padding: 5rem 0;
		box-sizing: border-box;
		position: relative;
	}
	.a-box-in {
		width: 90%;
		margin: auto;
	}
	.a-box-in p {
		font-size: 2rem;
		line-height: 2;
		font-family: "游ゴシック";
	}
	.a-box-in p span {
		font-size: 2rem;
		font-weight: 600;
		color: #052147;
	}
	.answer-box::before {
		position: absolute;
		top: -3rem;
		left: 50%;
		transform: translate(-50%);
		content: "";
		width: 0;
		height: 0;
		border-left: 30px solid transparent;
		border-right: 30px solid transparent;
		border-bottom: 30px solid #bbe2f1;
	}
	
}

@media screen and (max-width:420px){
	html {
		font-size: 6px;
	}
	body {
		max-width: 420px;
	}
	.sp-only {
		display: block;
	}
	
	/*ヘッダー*/
	.head-bar {
		display: none;
	}
	
	/*----------------------------------------------------*/
	.mainvisual {
		height: 32vh;
        margin-top: 12rem;
	}
	.mainvisual h1 {
		position: absolute;
		top: 22rem;
		right: 0.3rem;
		width: calc(100% - 40%);
	}
	.mainvisual .worries {
		display: none;
		position: absolute;
		top: 18rem;
		right: 1rem;
		width: calc(100% - 35%);
	}
	.worries-ttl {
		width: 80%;
		margin: 0 auto 1rem auto;
	}
	.worries-box {
		background: linear-gradient(#DDDCD8,#ffffff,#DDDCD8);
		padding: 3rem 0 1rem 0;
		border-radius: 3rem;
		width: 90%;
		margin: auto;
	} 
	.worries-box ul {
		width: 90%;
		margin: auto;
		gap: 1%;
	}
	.worries-box ul li {
		width: 100%;
		margin-left: auto;
		margin-right: auto;
	}
	.worries-box ul li:hover {
		box-shadow: none;
		background: #c0c0c0;
	}
	.worries-box ul li a {
		font-size: 1.8rem;
	}
	
	.sp-worries {
		padding: 3rem 0;
		background: url("../img/spw-bg.jpg");
		background-position: top center;
		background-size: cover;
	}
	
	/*金属アレルギーになる歯科材料*/
		#material {
			padding-top: 8rem;
			padding-bottom: 10rem;
		}
		.top-sectitle {
			text-align: center;
			font-size: 3.6rem;
			font-weight: 600;
			margin-bottom: 5rem;
		}
		.mate-flex {
			width: 90%;
			margin: auto;
			flex-direction: column;
			gap: 3rem;
		}
		.mate-img {
			width: 80%;
			margin: auto
		}
		.mate-txt {
			width: 100%;
			margin: auto;
		}

		/*金属を使用されている方へ*/
		#menu {
			background-image: url("../img/bg01.jpg");
			background-size: cover;
			padding: 5rem 0;
		}
		.menu-message {
			text-align: center;
			font-size: 3.6rem;
		}
		.bgtxt-b {
			font-size: 4.5rem;
			color: #1465CF;
			font-weight: 600;
		}
		.menu-wrapper {
			width: 95%;
			margin: 5rem auto;
			display: flex;
			justify-content: space-between;
			flex-direction: column;
		}
		.menu-item {
			width: 80%;
			margin: auto;
			position: relative;
			padding: 1rem 3rem;
		}
		.menu-item::before {
			 display: none;
		}
		.menu-item:first-of-type::before{
				content: none;
		}
		.menu-title {
			text-align: center;
			font-size: 2rem;
			margin-bottom: 1rem;
			border-top: 1px solid #a9a9a9;
			padding-top: 2rem;
		}
		.bgtxt-0 {
			font-size: 3rem;
			font-weight: 600;
		}
		.detail {
			width: 70%;
			margin: 2rem auto;
			background: linear-gradient(to top,#E2E2DA,#5A97E9);
			padding: 1rem 0;
			border-radius: 2rem;
			box-shadow: 0rem 0.5rem 0.1rem #ccc;
		}
		.detail a {
			display: block;
			text-align: center;
			font-size: 2rem;
			color: #fff;
		}
		.detail:active {
			box-shadow: none;
			position: relative;
			top: 0.5rem;
		}

		/*ドクター*/
		#doctor {
			padding: 5rem 0;
			color: #052147;
		}
		.doc-flex {
			width: 95%;
			margin: 0 auto;
			display: flex;
			gap: 3rem;
		}
		.doc-left,
		.doc-right {
			width: 45%;
			margin: auto;
		}
		.bgtxt-n {
			font-size: 4rem;
			font-weight: 600;
		}
		.plus {
			font-size: 2rem;
			margin: 1.6rem 0;
		}
		.fs30 {
			font-size: 2.4rem;
		}
		.doc-name {
			font-size: 3.6rem;
			font-weight: 600;
			margin-top: 1rem;
		}
		.readmore {
			margin-top: 3rem;
			width: 70%;
			background: linear-gradient(to top,#E6F0F6,#29729C);
			padding: 1rem 0;
			border-radius: 2rem;
			box-shadow: 0rem 0.5rem 0.1rem #ccc;
		}
		.readmore a {
			display: block;
			color: #fff;
			font-size: 2.6rem;
			font-weight: 600;
			text-align: center;
			letter-spacing: 0.1rem;
		}
		.readmore:active {
			box-shadow: none;
			position: relative;
			top: 0.5rem;
		}

		/*特徴*/
		#features {
			background-image: url("../img/bg02.jpg");
			background-size: cover;
			background-attachment: fixed;
			padding: 10rem 0;
			color: #052147;
		}
		.feature {
			width: 95%;
			margin: 5rem auto;
			background-color: #fff;
			padding: 4rem 0;
		}
		.feature-inner {
			width: 95%;
			margin: auto;
			display: flex;
			flex-wrap: wrap;
			gap: 3rem;
			flex-direction: column;
		}
		.feature-img {
			width: 90%;
			margin: auto;
		}
		.feature-img img {
			width: 100%;
		}
		.feature-txt {
			width: 90%;
		}
		.feature-title {
			font-size: 3.2rem;
			font-weight: 600;
		}
		.feature-p{
			width: 98%;
			font-size: 2rem;
			line-height: 2;
		}
		.f-plus {
			font-size: 3rem;
			margin: 1rem 0;
		}

		/*お知らせ*/
		#news {
			background: #fff;
			padding: 5rem 0;
		}
		.news-inner {
			width: 95%;
			margin: auto;
			border-top: 0.8rem solid #537BB0;
			border-bottom: 0.8rem solid #537BB0;
			padding: 5rem 0;
		}
		.bgtxt-ns {
			font-size: 7.2rem;
			font-weight: 600;
			color: #052147;
			text-align: center;
		}
		.news-box {
			height: 30rem;
			width: 90%;
			margin: auto;
			background: #fff;
			box-shadow: 10px 5px 5px #ccc;
			padding: 3rem 0;
		}
		.news-item {
			width: 100%;
			margin: auto;
			display: flex;
			align-items: center;
			gap: 3rem;
			border-bottom: 1px solid #ccc;
			padding-bottom: 2rem;
		}
		.day {
			font-size: 2rem;
			color: #052147;
		}
		.news-title {
			font-size: 2rem;
		}

		/*フッター*/
		#footer {
			background: linear-gradient(to top, #D8D9DA,#EBF2F2);
			padding-top: 3rem;
			padding-bottom: 1rem;
		}
		.footer-menu ul {
			width: 95%;
			margin: 0 auto 3rem auto;
			display: flex;
			justify-content: center;
			gap: 2rem;
            flex-wrap: wrap;
		}
		.footer-menu ul li {
			font-size: 14px;
            padding: 1rem 2rem;
            background: #E7E7E7;
		}
    .footer-menu ul li a
    {
        color: #333333;
    }
		.footer-info {
			width: 90%;
			margin: auto;
			text-align: center;
		}
		.footer-info img {
			width: 60%;
		}
		.f-adress {
			font-size: 2rem;
			text-align: center;
			margin: 2rem auto 1rem auto;
			letter-spacing: 0.2rem;
		}
		.f-tel {
			font-size: 2.4rem;
			text-align: center;
			font-weight: 600;
			margin-bottom: 1rem;
		}
		.f-tel i {
			color: #1485CF;
			margin-right: 1rem;
		}
		.map iframe {
			width: 100% !important;
			height: 30rem !important;
		}
		.footer-copy {
			margin-top: 1rem;
		}
		.footer-copy p {
			text-align: center;
			line-height: 2;
		}

		/*===== 下層ページ =====*/
		/*ヘッダー*/
		#s-header {
			margin-bottom: 5rem;
		}
		.s-head-bar {
			display: flex;
			justify-content: space-between;
			padding: 1rem;
			background: #fff;
			box-shadow: none;
			}
		.s-head-left h1 {
			width: 60%;
			margin-bottom: 1rem;
		}
		.s-head-left h1 a {
			display: block;
		}
		.s-head-left p {
			display:none;
		}
		.s-head-tel {
			display:none;
		}
		.s-telbnr {
			width: 24rem;
			padding: 0.8rem;
			background:linear-gradient(to bottom, #29729C, #E6F0F6);
			border-radius: 2rem;
		}
		.s-telbnr a {
			display: block;
			color: #fff;
			font-size: 2.8rem;
			text-align: center;
			font-weight: 600;
		}
		.s-telbnr a i {
			margin-right: 1rem;
		}


		.container {
			justify-content: space-between;
		}
		/*サイドバー*/
		.container aside {
			display: none;
		}
		


		/*メイン*/
		.container article {
			width: 100%;
		}
		.container article .inner {
			width: 100%;
			margin: auto;
		}
		.Topnav {
			display: none;
			width: calc(100% - 5%);
			margin: 0 auto 5rem auto;
			padding-bottom: 1rem;
			border-bottom: 2.4px dashed #c0c0c0;
		}
		.Topnav ul {
			justify-content: center;
			gap: 5%;
		}
		.Topnav ul li a {
			display: block;
			font-size: 1.6rem;
			color: #3D3C3C;
		}
		.sec-ttl {
			width: calc(100% - 10%);
			margin: auto;
			padding: 2rem 0;
			background: linear-gradient(#CDEFF3,#EBECEC);
		}
		.sec-ttl p {
			text-align: center;
			color: #052147;
			font-size: 4rem;
			font-weight: 600;
		}
		.ttl02 {
			width: calc(100% - 10%);
			margin: 5rem auto 8rem auto;
			position: relative;
			padding: 0.3rem 0;
			border-bottom: 2px solid;
			color: #707070;
			font-weight: bold;
			font-size: 26px;
			text-align: center;
		}
		.ttl02:before,
		.ttl02:after {
				position: absolute;
				top: 100%;
				left: 50%;
				content: "";
				height: 0;
				width: 0;
		}
		.ttl02:before {
				border: 8px solid;
				border-color: transparent;
				border-top-color: #707070;
				margin-left: -8px;
		}
		.ttl02:after {
				border: 5px solid;
				border-color: transparent;
				border-top-color: white;
				margin-left: -5px;
		}
		.ttl02 p {
			color: #052147;
			text-align: center;
			font-size: 4.2rem;
			letter-spacing: 3px;
		}


		/*歯科医師の紹介*/
		.doctor-intro {
			padding: 3rem 0;

		}
		.doctor-in {
			width: calc(100% - 10%);
			margin: 5rem auto;
			justify-content: space-between;
			align-items: center;
		}
		.doctor-in-left {
			width: 48%;
		}

		.doctor-in-left .bgtxt-n {
			font-size: 5rem;
			font-weight: 600;
		}
		.doctor-in-left .plus {
			font-size: 3rem;
			margin: 1rem 0;
		}
		.fs30 {
			font-size: 2rem;
		}
		.doctor-in-left .doc-name {
			font-size: 4.2rem;
			font-weight: 600;
			margin-top: 1rem;
		}
		.doc-name span {
			font-size: 2rem;
		}
		.doctor-in-left .doc-name {
			font-size: 3.6rem;
			font-weight: 600;
			margin-top: 1rem;
			line-height: 1;
		}
		.doctor-in-right {
			width: 50%;
		}
		.doctor-message {
			width: calc(100% - 14%);
			margin: 3rem auto;
		}
		.in-txt {
			font-size: 1.8rem;
			color: #052147;
			line-height: 2.5;
		}

		/*院長紹介*/
		.career-in {
			width: calc(100% - 15%);
			margin: 3rem auto;
			color: #052147;
		}
		.career-in .ttl {
			width: 100%;
			margin-top: 2rem;
			margin-bottom: 2rem;
			border-bottom: 1px solid #ccc;
		}
		.career-in .ttl p {
			font-size: 4rem;
		}
		.career-in dl {
			width: 100%;
			font-size: 2rem;
		}
		.career-in dl dt {
			width: 15%;
			padding: 0.8rem 0 0.8rem 1rem;
			box-sizing: border-box;
			border-bottom: 0.8px solid #D1CECE;
		}
		.career-in dl dd {
			width: 85%;
			padding: 0.8rem 0;
			border-bottom: 0.8px solid #D1CECE;
		}
		.career-in-flex {
			width: 100%;	
			justify-content: space-between;
		}
		.career-in-flex ul {
			width: 48%;
		}
		.career-in-flex ul li {
			font-size: 1.8rem;
			list-style-type: square;
			list-style-position: inside;
			padding: 0.8rem 0;
		}

		/*医院紹介*/
		.clinic-intro {
		}
		.clinic-in {
			width: 100%;
			padding: 5rem 0;
			margin: auto;
			justify-content: space-between;
			gap: 5rem;
			align-items: center;
		}
		.clinic-item {
			width: 80%;
			margin: auto;
			color: #052147;
		}
		.item-name {
			font-size: 2.4rem;
			font-weight: 600;
			text-align: center;
			letter-spacing: 1rem;
		}
		.item-txt {
			font-size: 1.4rem;
			line-height: 2;
		}

		/*治療の流れ*/
		.flow {
			padding: 5rem 0;
		}
		.flow-wrapper {
			width: 90%;
			margin: 5rem auto 0 auto;
		}
		.flow-item {
			padding: 2rem 0;
			box-shadow: 2px 2px 2px #ccc;
			margin-bottom: 5rem;
		}
		.flow-item:last-child {
			margin-bottom: 1rem;
		}
		.flow-item-in {
			width: 95%;
			margin: auto;
			justify-content: space-between;
		}
		.flow-left {
			width: 10%;
		}
		.flow-no {
			width: 6rem;
			height: 6rem;
			border-radius: 50%;
			background: #073756;
			margin: auto;
		}
		.flow-no p {
			color: #fff;
			line-height: 6rem;
			text-align: center;
			font-size: 3.6rem;
		}
		.flow-content {
			width: 85%;
		}
		.flow-ttl {
			border-bottom: 1px solid #ccc;
			margin-bottom: 2rem;
		}
		.flow-ttl p {
			color: #073756;
			font-size: 3rem;
			font-weight: 600;
		}
		.flow-txt {
			font-size: 1.8rem;
			line-height: 2;
		}

		/*医院情報*/
		.clinic-info {
			padding: 5rem 0;
			margin-bottom: 5rem;
		}
		.clinic-in {
			width: 95%;
			margin: 3rem auto;
			justify-content: space-between;
			align-items: center;
			gap: 3rem;
		}
		.clinic-left {
			width: 80%;
			margin: auto;
		}
		.clinic-left dl {
			font-size: 1.8rem;
		}
		.clinic-left dl dt {
			width: 30%;
			text-align: center;
			border-bottom: 1px solid #ccc;
			padding: 1rem 0;
			font-weight: 600;
		}
		.clinic-left dl dd {
			width: 70%;
			border-bottom: 1px solid #ccc;
			padding:1rem 0;
			line-height: 2;
		}
		.clinic-right {
			width: 90%;
			margin: auto;
		}
		.time-table {
			width: 85%;
			margin: auto;
		}



		/*----- 治療について -----*/
		.s-aboout {
			padding-top: 5rem;
		}
		.s-aboout .ttl02 {
			margin-bottom: 0;
		}
		.s-aboout .pic {
			width: 60%;
			margin: 2rem auto;
		}
		.s-aboout .txt-box {
			width: 85%;
			margin: auto;
		}

		.s-materia{
			padding-top: 5rem;
		}
		.s-material .txt-box {
			width: 85%;
			margin: 5rem auto;
		}
		.ma-wrapper {
			flex-direction: column;
			gap: 5rem;
			padding: 2rem 0;
			margin-bottom: 5rem;
		}
	.in-txt {
		font-size: 2rem;
	}
		.ma-item {
			width: 95%;
			margin: auto;
			padding: 2rem 0;
			color: #073756;
			background: #fff;
			box-shadow: 2px 2px 3px #ccc;
		}
		.ma-in {
			width: 90%;
			margin: auto;
		}
		.ma-ttl {
			text-align: center;
			font-size: 3rem;
			font-weight: 600;
			margin-bottom: 2rem;
		}
		.ma-txt {
			width: 95%;
			margin: auto;
			font-size: 2rem;
			line-height: 2;
		}
		.ma-feature {
			width: 90%;
			margin: 3rem auto;
			background: #D6ECF8;
			padding: 2rem 0;
		}
		.mf-ttl {
			text-align: center;
			font-size: 2.2rem;
			font-weight: 600;
		}
		.ma-feature ul {
			width: 90%;
			margin: 2rem auto;
		}
		.ma-feature ul li {
			font-size: 2rem;
			padding: 1rem;
			list-style: disc;
			list-style-position: inside;
		}

		/*入れ歯*/
		#dentures {
			margin-bottom: 10rem;
		}

		/*アレルギー*/
		#allergy {
			margin-bottom: 10rem;
		}
		.symptoms .txt-box {
			margin: 8rem auto;
		}
		.symptoms-wrapper {
			flex-direction: column;
			gap: 5rem;
		}
		.symptoms-box {
			width: 95%;
			margin: auto;
			padding: 3rem 0;
			color: #073756;
			background: #fff;
			box-shadow: 2px 2px 3px #ccc;
		}
		.symptoms-ttl {
			text-align: center;
			font-size: 3rem;
			font-weight: 600;
		}
		.symptoms-in {
			width: 90%;
			margin: auto;
			flex-direction: column;
		}
		.symptoms-in .left,
		.symptoms-in .right {
			width: 85%;
			margin: auto;
		}
		.navy-box {
			width: 90%;
			margin: 8rem auto;
			padding: 3rem 0;
			background: rgba(6,37,58,0.8);
		}
		.navy-box-in {
			width: 90%;
			margin: auto;
			border: 1px solid #fff;
			padding: 4rem;
			box-sizing: border-box;
		}
		.in-txt02 {
			color: #fff;
			line-height: 2;
			font-size: 2rem;
			text-align: center;
			letter-spacing: 3px;
		}


		/*メタルフリー治療*/
		#metalfree {
			margin-bottom: 10rem;
		}
		.metalfree-wrapper {
			width: 95%;
			padding: 5rem 0;
			margin: 5rem auto;
			flex-direction: column;
			gap: 5rem;
		}
		.metalfree-item-in {
			width: 100%;
			margin: auto;
			position: static;
			display: flex;
			flex-direction: column;
		}
		.m-in-img {
			width: 70%;
			margin-left: auto;
			margin-right: auto;
		}
		.m-in-txt {
			position: static;
			width: 100%;
		}
		.m-in-txt p,
		.m-in-txt02 p {
			font-size: 2rem;
			line-height: 2;
		}
		.m-in-img02 {
			width: 70%;
			margin-left: auto;
			margin-right: auto;
		}
		.m-in-txt02 {
			position: static;
			width: 100%;
		}

		/*-----Q&A-----*/

		.qa-wrapper {
			padding: 5rem 0;
		}
		.qa-container {
			width: calc(100% - 10%);
			margin: auto;
			padding: 5rem 0;
		}


		h3 {
			position: relative;
			text-align: center;
			font-size: 3.2rem;
			font-weight: 600;
			padding-bottom: 1rem;
		}
		h3:before {
			position: absolute;
			bottom: -10px;
			left: 50%;
			transform: translate(-50%);
			width: 70rem;
			height: 5px;
			content: '';
			background:linear-gradient(to right, #052147, #CDEFF3);
		}
		.answer-box {
			width: calc(100% - 5%);
			margin: 8rem auto;
			background: linear-gradient(#bbe2f1,#ccffff);
			padding: 5rem 0;
			box-sizing: border-box;
			position: relative;
		}
		.a-box-in {
			width: 90%;
			margin: auto;
		}
		.a-box-in p {
			font-size: 2.2rem;
			line-height: 2;
			font-family: "游ゴシック";
		}
		.a-box-in p span {
			font-size: 2rem;
			font-weight: 600;
			color: #052147;
		}
		.answer-box::before {
			position: absolute;
			top: -3rem;
			left: 50%;
			transform: translate(-50%);
			content: "";
			width: 0;
			height: 0;
			border-left: 30px solid transparent;
			border-right: 30px solid transparent;
			border-bottom: 30px solid #bbe2f1;
		}
    #page-top a {
  font-size: 2rem;
}
    #page-top {
  bottom: 66px;
}
    .spheader
    {
        position: fixed;
        top: 0;
        left: 0;
        background: rgba(255,255,255,0.90);
        display: flex;
        align-items: center;
        height: 12rem;
        z-index: 999;
    }
	
	.h_logo
    {
        width: 60%;
        padding: 1rem;
        margin-right: 5vw;
    }
    .f_btn
    {
        position: fixed;
        bottom: 0;
        z-index: 999;
        display: flex;
        align-items: center;
        justify-content: space-between;
    }
    
}