/*
Theme Name: OZ-Dental
Theme URI: https://oz-dent.com/
Description: 王禅寺歯科クリニック オリジナルテーマ
Version: 1.0 / 2026.07.18~
Author: デザイン事務所 Chiffote
Author URI: https://chiffote.jp/
*/



body {
	font-family: "Zen Kaku Gothic Antique", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", "Meiryo", Osaka, "ＭＳ Ｐゴシック", "MS PGothic";
	color: #222;
	font-size: 17px;
	line-height: 2;
	letter-spacing:0.03em;
	text-align:justify;
  	font-weight: 400;
  	font-style: normal;
}
a {
	color: var(--color-gold);
	text-decoration: none;
	transition: 0.3s ease-out;
}
a:hover {
	color: var(--color-blue);
}

::selection{background-color:var(--color-gold-light); color: #FFF;}
::-moz-selection{background-color:var(--color-gold-light); color: #FFF;}

body , header , footer{
	min-width: 1300px;
	max-width: 1920px;
	margin: auto;
}
@media screen and (max-width:640px) {
	body{font-size: 16px;}
	body,header,footer{min-width: 400px;}
}



/*============================================================================

	設定カラー

============================================================================*/
:root {
	--color-blue: #425677; /*濃紺*/
	--color-gold: #7d6540; /*ゴールド*/
	--color-gold-light: #b5976a; /*薄いゴールド*/
}



/*============================================================================

	モーション　＊　loftloader

============================================================================*/
#loftloader-wrapper {
	min-width: 400px !important;
}
#loftloader-wrapper .loader-section.section-fade {
	min-width: 400px !important;
}



/*============================================================================

	#mainvisual　＊　下層のMV

============================================================================*/
#mainvisual {
	position: relative;
	width: 100%;
	height: 530px;
	margin: auto;
	overflow: hidden;
	display: flex;
	align-items: center;
	background: linear-gradient(to bottom, #ffffff 340px, #e8e4dc 340px);
}
#mainvisual::after {
	position: absolute; content: "";
	width: 100%; height: 150px;
	top: 0; left: 0;
	background: #FFF;
}
#mainvisual::before {
	position: absolute; content: "";
	width: calc( 100% - 470px ); height: 350px;
	top: 150px; right: 0;
	background: url("images/mainvisual.jpg") center no-repeat;
	background-size: cover;
}
#mainvisual h2 {
	padding-top: 100px;
	padding-left: 5%;
	line-height: 1;
	z-index: 5;
}
#mainvisual h2 em {
	display: block;
	font-family: "Cormorant Infant", serif;
	font-size: 80px;
	font-weight: 300;
	margin-bottom: 30px;
}
#mainvisual h2 span {
	display: block;
	font-family: "Shippori Mincho B1", serif;
	font-size: 22px;
	letter-spacing: 6px;
}
@media screen and (max-width: 640px) {
	#mainvisual {
		height: 280px;
		background: linear-gradient(to bottom, #ffffff 190px, #e8e4dc 190px);
	}
	#mainvisual::after {
		height: 80px;
	}
	#mainvisual::before {
		width: 90%;
		height: 180px;
		top: 80px;
	}
	#mainvisual h2 {
		padding-top: 55px;
		padding-left: 0;
	}
	#mainvisual h2 em {
		font-size: 40px;
		margin-bottom: 10px;
		background: #FFF;
		padding: 2px 20px;
	}
	#mainvisual h2 span {
		display: inline-block;
		font-size: 16px;
		letter-spacing: 2px;
		background: #FFF;
		padding: 3px 20px 4px;
	}
}





/*==================================================================

	main

==================================================================*/
main {	
	padding: 80px 0 120px;
}
main .wrapper {
	width: 90%;
	max-width: 1280px;
	margin: auto;
}
main .bg01 {
	background: #f9f7f5;
	padding: 80px 0 20px;
	margin-bottom: 80px;
}
@media screen and (max-width: 640px) {
	main {	
		padding: 60px 0 80px;
	}
	main .bg01 {
		padding: 60px 0 1px;
		margin-bottom: 60px;
	}
}





/*==================================================================

	 タイトル

==================================================================*/
h3 {
	position: relative;
	margin-bottom: 40px;
	text-align: center; 
	font-family: "Shippori Mincho B1", serif;
	font-size: 25px;
	line-height: 1;
	letter-spacing: 5px;
}
h3 em {
	display: block;
	margin-bottom: 20px;
	font-family: "Cormorant Infant", serif;
  	font-optical-sizing: auto;
	font-size: 100px;
	font-weight: 300;
	letter-spacing: 8px;
}
@media screen and (max-width: 640px) {
	h3 {
		font-size: 20px;
		letter-spacing: 3px;
		margin-bottom: 30px;
	}
	h3 em {
		font-size: 52px;
		letter-spacing: 4px;
		margin-bottom: 14px;
	}
}


main h4 {
	position: relative;
	margin-top: 40px;
	margin-bottom: 20px;
	font-family: "Shippori Mincho B1", serif;
	font-size: 25px;
	line-height: 1;
	letter-spacing: 2px;
	color: var(--color-gold);
}
@media screen and (max-width: 640px) {
	main h4 {
		margin-top: 30px;
		margin-bottom: 5px;
		font-size: 20px;
		line-height: 1.7;
		letter-spacing: 0;
	}
}





/*==================================================================

	text

==================================================================*/
.text {
	position:relative;
	margin-bottom:50px;
}
.text p {
	margin-bottom:1em;
}
.text:last-child{
	margin-bottom:0;
}





/*==================================================================

	btn

==================================================================*/
.btn01 {
	display: flex;
	justify-content: center;
}
.btn01 a {
	height: 70px;
	padding: 0 5.5%;
	display: flex;
	align-items: center;
	justify-content: center;
	background: linear-gradient(to right, #9a7c4e, #b5976a);
	font-family: "Shippori Mincho B1", serif;
	font-size: 18px;
	color: #fff;
}
.btn01 a:hover {
	transform: translateY(-3px);
	box-shadow: 0 6px 16px rgba(0,0,0,0.15);
}
@media screen and (max-width: 640px) {
	.btn01 a {
		height: 56px;
		font-size: 16px;
		padding: 0 6%;
	}
}


.btn02 a {
	display: inline-flex;
	align-items: center;
	gap: 20px;
	font-family: "Shippori Mincho B1", serif;
	font-size: 18px;
	color: #222;
	transition: 0.3s ease;
}
.btn02 a::before {
	content: '';
	display: block;
	width: 50px;
	height: 1px;
	margin-top: 1px;
	background: #222;
	transition: 0.3s ease;
	flex-shrink: 0;
}
.btn02 a:hover {
	gap: 10px;
	color: var(--color-gold-light);
}
.btn02 a:hover::before {
	width: 60px;
	background: var(--color-gold-light);
}
@media screen and (max-width: 640px) {
	.btn02 a {
		font-size: 17px;
		gap: 14px;
	}
	.btn02 a::before {
		width: 34px;
	}
	.btn02 a:hover::before {
		width: 44px;
	}
}





/*==================================================================

	$first　＊　初診の方へ

==================================================================*/
#first {
	padding-bottom: 0;
}
/*------------------------------ 重要ですので必ずお読みください ------------------------------*/
#first_strong {
	background: var(--color-blue);
	color: #FFF;
	text-align: center;
	font-family: "Shippori Mincho B1", serif;
	font-size: 22px;
	margin-bottom: 70px;
	padding: 10px;
}

/*------------------------------ 予約のこと ------------------------------*/
@media screen and (max-width: 640px) {
	#first-02 h3 em {font-size: 48px;}
}

/*------------------------------ キャンセルポリシー ------------------------------*/
#first-04 {
	width: 90%;
	margin: 0 auto 90px;
}
@media screen and (max-width: 640px) {
	#first-04 {
		width: 100%;
		margin-bottom: 60px;
	}
}

/*------------------------------ プライバシーポリシー ------------------------------*/
#first-05 {
	width: 90%;
	margin: 0 auto 90px;
}
.privacy dt {
	font-family: "Shippori Mincho B1", serif;
	font-size: 22px;
	color: var(--color-blue);
	margin: 30px 0 5px;
	letter-spacing: 1px;
}
.privacy dd {
	padding-left: 1.5em;
}
@media screen and (max-width: 640px) {
	#first-05 {
		width: 100%;
		margin-bottom: 60px;
	}
	.privacy dt {
		font-size: 19px;
		margin: 24px 0 5px;
	}
	.privacy dd {
		padding-left: 1em;
	}
}

/*------------------------------ 施設基準 ------------------------------*/
#first-08 {
	width: 90%;
	margin: 0 auto 90px;
}
#first-08.privacy .list {
	margin-top: 10px;
}
#first-08.privacy .list li {
	margin-bottom: 5px;
}
@media screen and (max-width: 640px) {
	#first-08 {
		width: 100%;
		margin-bottom: 60px;
	}
}

/*------------------------------ 当院の強み ------------------------------*/
#first #top_philosophy {
	padding: 100px 0 60px;
}
@media screen and (max-width: 640px) {
	#first #top_philosophy {
		padding: 60px 0 50px;
	}
}





/*==================================================================

	$orthodontics　＊　矯正歯科

==================================================================*/
#orthodontics {
	padding-bottom: 0;
}
/*------------------------------ 歯並びのことでこのようなことはありませんか ------------------------------*/
@media screen and (max-width: 640px) {
	#ortho-02 h3 {line-height: 1.6; letter-spacing: 1px;}
	#ortho-02 h3 em {line-height: 1; letter-spacing: 4px;}
}

/*------------------------------ 歯並びや噛み合わせのことで患者さんが悩まれること ------------------------------*/
@media screen and (max-width: 640px) {
	#ortho-03 h3 {line-height: 1.6; letter-spacing: 1px;}
	#ortho-03 h3 em {line-height: 1; letter-spacing: 4px;}
}

/*------------------------------ 当院の使命 ------------------------------*/
#ortho-07.section_01 .inner {
	align-items: center;
}




/*==================================================================

	$cavity　＊　一般歯科

==================================================================*/
#cavity {
	padding-bottom: 0;
}
/*------------------------------ むし歯治療 ------------------------------*/
#cavity-04.section_01 .inner {
	align-items: center;
}
/*------------------------------ 患者さんからよくある質問：むし歯治療 ------------------------------*/
@media screen and (max-width: 640px) {
	#cavity-06 h3 {line-height: 1.6; letter-spacing: 1px;}
	#cavity-06 h3 em {line-height: 1; letter-spacing: 4px;}
}
/*------------------------------ 歯周病治療 ------------------------------*/
#cavity-07.section_01 .inner {
	align-items: center;
}
@media screen and (max-width: 640px) {
	#cavity-07 h3 em {
		font-size: 44px;
	}
}
/*------------------------------ 患者さんからよくある質問：歯周病治療 ------------------------------*/
@media screen and (max-width: 640px) {
	#cavity-09 h3 {line-height: 1.6; letter-spacing: 1px;}
	#cavity-09 h3 em {line-height: 1; letter-spacing: 4px;}
}
/*------------------------------ むし歯治療・歯周病治療：共通 ------------------------------*/
.stages_grid {
	margin: 50px auto 20px;
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 20px;
}
.stages_grid--3col { grid-template-columns: repeat(3, 1fr); width: 90%;}
.stages_grid > li {
	background: #f9f7f5;
	padding: 24px 35px;
}
.section_01 .stages_grid figure {
	width: 100%;
	max-width: 250px;
	margin: auto;
}
.stages_grid h4 {
	margin-bottom: 20px;
	padding-bottom: 15px;
	border-bottom: 1px solid #ccc;
	text-align: center;
}
.stages_grid h4 em {
	display: block;
	margin-top: 15px;
	font-size: 20px;
	font-family: "Cormorant Infant", serif;
}
.section_01 .stages_grid .list li {
	margin-bottom: 5px;
}
@media screen and (max-width: 1440px) {
	.stages_grid > li {
		padding: 24px 25px;
	}
}
@media screen and (max-width: 640px) {
	.stages_grid {
		margin: 20px auto 0;
		grid-template-columns: repeat(2, 1fr);
		gap: 10px;
		font-size: 15px;
		line-height: 1.8;
	}
	.stages_grid--3col {
		width: 100%;
		grid-template-columns: repeat(2, 1fr);
	}
	.stages_grid > li {
		padding: 15px 15px;
	}
	.stages_grid h4 {
		margin-top: 10px;
		margin-bottom: 10px;
		padding-bottom: 5px;
	}
	.stages_grid h4 em {
		margin-top: 0;
		font-size: 16px;
	}
	.section_01 .stages_grid .list li {
		padding-left: 15px;
	}
	.section_01 .stages_grid .list li::before {
		top: 11px;
	}
}
/*------------------------------ 当院の使命 ------------------------------*/
#cavity-10.section_01 .inner {
	align-items: center;
}





/*==================================================================

	$implant　＊　インプラント

==================================================================*/
#implant {
	padding-bottom: 0;
}
/*------------------------------ お口の中（歯）のことでこのようなことはありませんか？ ------------------------------*/
@media screen and (max-width: 640px) {
	#implant-02 h3 {line-height: 1.6; letter-spacing: 1px;}
	#implant-02 h3 em {line-height: 1; letter-spacing: 4px;}
}

/*------------------------------ 歯並びや噛み合わせのことで患者さんが悩まれること ------------------------------*/
@media screen and (max-width: 640px) {
	#implant-03 h3 {line-height: 1.6; letter-spacing: 1px;}
	#implant-03 h3 em {line-height: 1; letter-spacing: 4px;}
}

/*------------------------------ インプラントをすることで得られる効果 ------------------------------*/
#implant-04 ul {
	display: flex;
	flex-wrap: wrap;
	gap: 24px; /* 既存のgap */
}
#implant-04 ul li:nth-child(-n+2) {
	width: calc(50% - 12px); /* gap÷2 */
}
#implant-04 ul li:nth-child(n+3) {
	width: calc(33.333% - 16px); /* gap×2÷3 */
}
@media screen and (max-width: 640px) {
	#implant-04 h3 {line-height: 1.6; letter-spacing: 1px;}
	#implant-04 h3 em {line-height: 1; letter-spacing: 4px;}
	#implant-04 ul {
		gap: 16px;
	}
	#implant-04 ul li:nth-child(-n+2),
	#implant-04 ul li:nth-child(n+3) {
		width: 100%;
	}
}

/*------------------------------ 患者さんからよくある質問：自家歯牙移植 ------------------------------*/
@media screen and (max-width: 640px) {
	#transplant-06 h3 {line-height: 1.6; letter-spacing: 1px;}
	#transplant-06 h3 em {line-height: 1; letter-spacing: 4px;}
}

/*------------------------------ 口腔外科の対象となる疾患や症状は？ ------------------------------*/
@media screen and (max-width: 640px) {
	#oral-02 h3 {line-height: 1.6; letter-spacing: 1px;}
	#oral-02 h3 em {line-height: 1; letter-spacing: 4px;}
}

/*------------------------------ 患者さんからよくある質問：親知らずの抜歯 ------------------------------*/
@media screen and (max-width: 640px) {
	#oral-05 h3 {line-height: 1.6; letter-spacing: 1px;}
	#oral-05 h3 em {line-height: 1; letter-spacing: 4px;}
}

/*------------------------------ 当院の使命 ------------------------------*/
#implant-08.section_01 .inner {
	align-items: center;
}





/*==================================================================

	$oral　＊　自家歯牙移植・歯科口腔外科

==================================================================*/
#oral {
	padding-bottom: 0;
}

/*------------------------------ お口の中（歯）のことでこのようなことはありませんか？ ------------------------------*/
@media screen and (max-width: 640px) {
	#transplant-02 h3 {line-height: 1.6; letter-spacing: 1px;}
	#transplant-02 h3 em {line-height: 1; letter-spacing: 4px;}
}

/*------------------------------ 歯牙移植が対象となる方は？ ------------------------------*/
@media screen and (max-width: 640px) {
	#transplant-03 dt { line-height: 1.4;}
}

/*------------------------------ 自家歯牙移植をすることで得られる効果 ------------------------------*/
@media screen and (max-width: 640px) {
	#transplant-04 h3 {line-height: 1.6; letter-spacing: 1px;}
	#transplant-04 h3 em {line-height: 1; letter-spacing: 4px;}
	#transplant-04 dt { line-height: 1.4;}
}

/*------------------------------ 当院の使命 ------------------------------*/
#oral-06.section_01 .inner {
	align-items: center;
}




/*==================================================================

	$visit　＊　訪問歯科診療

==================================================================*/
#visit {
	padding-bottom: 0;
}

/*------------------------------ 訪問歯科診療について悩まれること ------------------------------*/
@media screen and (max-width: 640px) {
	#visit-03 h3 {line-height: 1.6; letter-spacing: 1px;}
	#visit-03 h3 em {line-height: 1; letter-spacing: 4px;}
}

/*------------------------------ 当院の訪問歯科診療対象地域と訪問歯科で行うこと ------------------------------*/
#visit-04 ul {
	display: flex;
	flex-wrap: wrap;
	gap: 24px; /* 既存のgap */
}
#visit-04 ul li:nth-child(-n+2) {
	width: calc(50% - 12px); /* gap÷2 */
}
#visit-04 ul li:nth-child(n+3) {
	width: calc(33.333% - 16px); /* gap×2÷3 */
}
@media screen and (max-width: 640px) {
	#visit-04 h3 {line-height: 1.6; letter-spacing: 1px;}
	#visit-04 h3 em {line-height: 1; letter-spacing: 4px;}
	#visit-04 ul {
		gap: 16px;
	}
	#visit-04 ul li:nth-child(-n+2),
	#visit-04 ul li:nth-child(n+3) {
		width: 100%;
	}
}

/*------------------------------ ご用意いただくもの ------------------------------*/
.visit_prepare {
	margin: 0 auto 90px;
	padding: 10px 50px;
	background: #f9f7f5;
	text-align: center;
}
.visit_prepare .list {
	display: flex;
	gap: 20px;
	margin-top: 40px;
}
.visit_prepare .list li {
	flex: 1;
	background: #FFF;
	border-radius: 10px;
	padding: 10px 20px;
	white-space: nowrap;
	display: flex;
	align-items: center;
	justify-content: center;
}
@media screen and (max-width: 640px) {
	.visit_prepare {
		padding: 5px 20px 30px;
		margin-bottom: 60px;
	}
	.visit_prepare .list {
		flex-direction: column;
		gap: 10px;
		margin-top: 20px;
	}
	.visit_prepare .list li {
		white-space: normal;
		justify-content: flex-start;
		margin-bottom: 0;
	}
}

 
/* テキストリンク */
#visit .text_link {
	color: var(--color-blue);
	text-decoration: underline;
}
#visit .text_link:hover {
	opacity: 0.7;
}


/*------------------------------ 当院の使命 ------------------------------*/
#visit-07.section_01 .inner {
	align-items: center;
}




/*==================================================================

	$children　＊　小児歯科

==================================================================*/
#children {
	padding-bottom: 0;
}

/*------------------------------ こんなお悩みはありませんか ------------------------------*/
@media screen and (max-width: 640px) {
	#children-02 h3 {line-height: 1.6; letter-spacing: 1px;}
	#children-02 h3 em {line-height: 1; letter-spacing: 4px;}
}

/*------------------------------ お子さん・親御さんが悩まれること ------------------------------*/
@media screen and (max-width: 640px) {
	#children-03 h3 {line-height: 1.6; letter-spacing: 1px;}
	#children-03 h3 em {line-height: 1; letter-spacing: 4px;}
}

/*------------------------------ 当院の小児歯科で行うこと ------------------------------*/
#children-04 ul {
	display: flex;
	flex-wrap: wrap;
	gap: 24px; /* 既存のgap */
}
#children-04 ul li:nth-child(-n+2) {
	width: calc(50% - 12px); /* gap÷2 */
}
#children-04 ul li:nth-child(n+3) {
	width: calc(33.333% - 16px); /* gap×2÷3 */
}
@media screen and (max-width: 640px) {
	#children-04 h3 {line-height: 1.6; letter-spacing: 1px;}
	#children-04 h3 em {line-height: 1; letter-spacing: 4px;}
	#children-04 ul {
		gap: 16px;
	}
	#children-04 ul li:nth-child(-n+2),
	#children-04 ul li:nth-child(n+3) {
		width: 100%;
	}
}

/*------------------------------ 当院の使命 ------------------------------*/
#children-07.section_01 .inner {
	align-items: center;
}




/*==================================================================

	$swallow　＊　摂食嚥下リハビリ

==================================================================*/
#swallow {
	padding-bottom: 0;
}

/*------------------------------ 摂食嚥下低下で悩まれること ------------------------------*/
@media screen and (max-width: 640px) {
	#swallow-03 h3 {line-height: 1.6; letter-spacing: 1px;}
	#swallow-03 h3 em {line-height: 1; letter-spacing: 4px;}
}

/*------------------------------ 当院の摂食嚥下機能の回復で行うこと ------------------------------*/
#swallow-04 .check_list {
	display: block;
	margin: 10px 0;
}
#swallow-04 .check_list li {
	position: relative;
	margin-bottom: 6px;
	padding: 0;
	padding-left: 20px;
}
#swallow-04 .check_list li::before {
	position: absolute; content: '';
	left: 0;
	top: 14px;
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background: var(--color-gold-light);
}
@media screen and (max-width: 640px) {
	#swallow-04 h3 {line-height: 1.6; letter-spacing: 1px;}
	#swallow-04 h3 em {line-height: 1; letter-spacing: 4px;}
	#swallow-04 .check_list li::before {
		top: 11px;
		left: 4px;
	}
}

/*------------------------------ 当院の使命 ------------------------------*/
#swallow-06.section_01 .inner {
	align-items: center;
}




/*==================================================================

	$denture　＊　入れ歯（義歯）治療

==================================================================*/
#denture {
	padding-bottom: 0;
}

/*------------------------------ こんなお悩みはありませんか ------------------------------*/
@media screen and (max-width: 640px) {
	#denture-02 h3 {line-height: 1.6; letter-spacing: 1px;}
	#denture-02 h3 em {line-height: 1; letter-spacing: 4px;}
}

/*------------------------------ 患者さんが悩まれること ------------------------------*/
@media screen and (max-width: 640px) {
	#denture-03 h3 {line-height: 1.6; letter-spacing: 1px;}
	#denture-03 h3 em {line-height: 1; letter-spacing: 4px;}
}

/*------------------------------ 当院の入れ歯治療 ------------------------------*/
#denture-04 ul {
	display: flex;
	flex-wrap: wrap;
	gap: 24px; /* 既存のgap */
}
#denture-04 ul li:nth-child(-n+2) {
	width: calc(50% - 12px); /* gap÷2 */
}
#denture-04 ul li:nth-child(n+3) {
	width: calc(33.333% - 16px); /* gap×2÷3 */
}
@media screen and (max-width: 640px) {
	#denture-04 ul {
		gap: 16px;
	}
	#denture-04 ul li:nth-child(-n+2),
	#denture-04 ul li:nth-child(n+3) {
		width: 100%;
	}
	#denture-04 dt { line-height: 1.4;}
}

/*------------------------------ 流れ ------------------------------*/
@media screen and (max-width: 640px) {
	#denture-05 li:first-of-type dt {font-size: 17px; letter-spacing: 0;}
}
/*------------------------------ 当院の使命 ------------------------------*/
#denture-07.section_01 .inner {
	align-items: center;
}





/*==================================================================

	$prevention　＊　予防歯科・定期検診

==================================================================*/
#prevention {
	padding-bottom: 0;
}

/*------------------------------ グラフのセクション ------------------------------*/
#prevention-01.section_01 {
	margin-bottom: 40px;
}
.prevention_graph {
	margin-bottom: 90px;
}
.prevention_graph figure {
	text-align: center;
}
.prevention_graph figure img {
	width: 60%;
	height: auto;
	flex-shrink: 0;
}
.prevention_graph figcaption {
	margin-top: 60px;
}
@media screen and (max-width: 640px) {
	.prevention_graph {
		margin-bottom: 60px;
	}
	.prevention_graph figure img {
		width: 100%;
	}
	.prevention_graph figcaption {
		margin-top: 30px;
	}
}

/*------------------------------ 当院で行う予防歯科 ------------------------------*/
#prevention-04 ul {
	display: flex;
	flex-wrap: wrap;
	gap: 24px; /* 既存のgap */
}
#prevention-04 ul li:nth-child(-n+2) {
	width: calc(50% - 12px); /* gap÷2 */
}
#prevention-04 ul li:nth-child(n+3) {
	width: calc(33.333% - 16px); /* gap×2÷3 */
}
@media screen and (max-width: 640px) {
	#prevention-04 ul {
		gap: 16px;
	}
	#prevention-04 ul li:nth-child(-n+2),
	#prevention-04 ul li:nth-child(n+3) {
		width: 100%;
	}
	#prevention-04 dt { line-height: 1.4;}
}

/*------------------------------ 当院の使命 ------------------------------*/
#prevention-07.section_01 .inner {
	align-items: center;
}





/*==================================================================

	$nutrition　＊　栄養相談・栄養指導

==================================================================*/
#nutrition {
	padding-bottom: 0;
}

/*------------------------------ 当院の栄養相談・栄養指導の特徴 ------------------------------*/
#nutrition-04 ul {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
}
#nutrition-04 ul li {
	width: calc(33.333% - 7px); 
	letter-spacing: 0;
}
@media screen and (max-width: 640px) {
	#nutrition-04 ul {
		gap: 16px;
	}
	#nutrition-04 ul li:nth-child(-n+2),
	#nutrition-04 ul li:nth-child(n+3) {
		width: 100%;
	}
}

/*------------------------------ 患者さんが悩まれること ------------------------------*/
@media screen and (max-width: 640px) {
	#nutrition-08 h3 {line-height: 1.6; letter-spacing: 1px;}
	#nutrition-08 h3 em {line-height: 1; letter-spacing: 4px;}
}




/*==================================================================

	#access　＊　アクセス

==================================================================*/

/*------------------------------ 医院概要 ------------------------------*/
#access-01 {
	margin-bottom: 90px;
}
#access-01 h3 {
	margin-bottom: 60px;
}
#access-01 .inner {
	display: flex;
	gap: 80px;
	align-items: stretch;
	flex-direction: row-reverse;
}
#access_logo {
	margin-bottom: 30px;
}
#access_logo img {
	width: 300px;
	height: auto;
}
#access-01 dl {
	display: grid;
	grid-template-columns: 130px 1fr;
	gap: 0;
	line-height: 1.8;
}
#access-01 dl dt,
#access-01 dl dd {
	display: flex;
	align-items: center;
}
#access-01 dl dt {
	color: var(--color-blue);
	padding: 14px 0 14px 20px;
	border-bottom: 1px solid #e0dbd3;
}
#access-01 dl dd {
	padding: 14px 20px 14px 0;
	border-bottom: 1px solid #e0dbd3;
}
#access-01 dl dd:nth-of-type(3) {
	font-family: "Cormorant Infant", serif;
  	font-optical-sizing: auto;
	color: var(--color-gold);
	font-size: 26px;
	letter-spacing: 2px;
}
#access-01 figure {
	flex: 1;
}
#access-01 figure img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
}
@media screen and (max-width: 640px) {
	#access-01 {
		margin-bottom: 60px;
	}
	#access-01 h3 {
		margin-bottom: 40px;
	}
	#access-01 .inner {
		flex-direction: column;
		gap: 30px;
	}
	#access-01 dl {
		grid-template-columns: 90px 1fr;
	}
	#access-01 dl dt,
	#access-01 dl dd {
		padding: 14px 0;
	}
	#access_logo { display: none;}
	#access-01 figure img {
		height: auto;
		aspect-ratio: 4 / 2;
	}
}

/*------------------------------ 診療時間 ------------------------------*/
#access-02 {
	margin-bottom: 90px;
}
#access-02 h3 {
	margin-bottom: 60px;
}
#access-02 .inner {
	width: 90%;
	max-width: 900px;
	margin: auto;
}
@media screen and (max-width: 640px) {
	#access-02 {
		margin-bottom: 60px;
	}
	#access-02 h3 {
		margin-bottom: 40px;
	}
	#access-02 .inner {
		width: 100%;
		overflow-x: auto;
	}
}

/*------------------------------ Googleマップ ------------------------------*/
#access-03 {
	margin-bottom: 90px;
}
#access-03 h3 {
	margin-bottom: 60px;
}
#access-03 iframe {
	width: 100%;
	height: 450px;
}

@media screen and (max-width: 640px) {
	#access-03 h3 {
		margin-bottom: 40px;
	}
}

/*------------------------------ 駐車場案内 ------------------------------*/
#access-04 h3 {
	margin-bottom: 60px;
}
#access-04 .inner {
	display: flex;
	gap: 60px;
}
#access-04 .inner figure:first-child {
	width: 300px;
}
#access-04 .inner figure:last-child {
	width: 900px;
}
#access-04 .inner figure img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
}
@media screen and (max-width: 640px) {
	#access-04 h3 {
		margin-bottom: 40px;
	}
	#access-04 .inner {
		flex-direction: column;
		gap: 20px;
	}
	#access-04 .inner figure img {
		height: auto;
	}
	#access-04 .inner figure:first-child {
		width: 300px;
		height: 300px;
		overflow: hidden;
		margin: auto;
	}
	#access-04 .inner figure:first-child img {
		width: 100%;
		height: 100%;
		object-fit: cover;
		object-position: bottom;
	}
	#access-04 .inner figure:last-child {
		width: 100%;
	}
}





/*==================================================================

		#about　当院のコンセプト

==================================================================*/
#about { padding-bottom: 0;}

/*------------------------------ 診療理念 ------------------------------*/
.about_lead {
	margin-bottom: 110px;
}
.about_lead .inner {
	display: flex;
	gap: 60px;
	align-items: center;
	flex-direction: row-reverse;
}
.about_lead .inner figure {
	width: 45%;
	flex-shrink: 0;
}
.about_lead .inner figure img {
	width: 100%;
	height: auto;
}
.about_lead .text {
	flex: 1;
	font-size: 17px;
	line-height: 2;
}
@media screen and (max-width: 640px) {
	.about_lead {
		margin-bottom: 60px;
	}
	.about_lead .inner {
		flex-direction: column;
		gap: 30px;
	}
	.about_lead .inner figure {
		width: 100%;
	}
}

/*------------------------------ 3つの理念カード ------------------------------*/
#about-02 {
	width: 90%;
	max-width: 1600px;
	margin: 0 auto 90px;
}
@media screen and (max-width: 640px) {
	#about-02 h3 {line-height: 1.6; letter-spacing: 1px;}
	#about-02 h3 em {line-height: 1; letter-spacing: 4px;}
}
.about_value_list {
	display: flex;
	gap: 3%;
	margin-top: 60px;
}
.about_value_list li {
	flex: 1;
}
.about_value_list figure {
	width: 100%;
}
.about_value_list figure img {
	width: 100%;
}
.about_value_list i {
	font-family: "Cormorant Infant", serif;
	font-style: normal;
	font-size: 30px;
	color: var(--color-gold-light);
	line-height: 1;
	margin-top: 30px;
	display: block;
}
.about_value_list h4 {
	font-size: 24px;
	margin-top: 5px;
	margin-bottom: 16px;
	line-height: 1.9;
}
@media screen and (max-width: 640px) {
	#about-02 {
		margin-bottom: 60px;
	}
	.about_value_list {
		flex-direction: column;
		gap: 40px;
		margin-top: 40px;
	}
	.about_value_list i {
		font-size: 20px;
	}
	.about_value_list h4 {
		font-size: 22px;
	}

}

/*------------------------------ チームで守る、口からの健康 ------------------------------*/
.about_team {
	padding-bottom: 90px;
}
.about_team_lead {
	margin-bottom: 50px;
	line-height: 1.9;
}
.about_team figure {
	width: 100%;
}
.about_team figure img {
	width: 100%;
}
.about_team_msg {
	margin: 40px 0 45px;
	text-align: center;
	font-family: "Shippori Mincho B1", serif;
	font-size: 22px;
	color: var(--color-blue);
}

.about_team_list {
	display: grid;
	grid-template-columns: repeat(6, 1fr);
	gap: 20px;
}
.about_team_list li:nth-child(1),
.about_team_list li:nth-child(2) {
	grid-column: span 3;
}
.about_team_list li:nth-child(3),
.about_team_list li:nth-child(4),
.about_team_list li:nth-child(5) {
	grid-column: span 2;
}

.about_team_list li {
	height: 100%;
	background: #fff;
	padding: 30px;
	box-sizing: border-box;
}
.about_team_list h4 {
	margin-top: 10px;
	font-size: 22px;
	color: var(--color-gold);
	margin-bottom: 14px;
	padding-bottom: 16px;
	border-bottom: 1px solid #e0dbd3;
}
@media screen and (max-width: 640px) {
	.about_team {
		padding-bottom: 60px;
	}
	.about_team_lead {
		margin-bottom: 30px;
	}
	.about_team_msg {
		font-size: 17px;
		margin: 30px 0 35px;
	}
	.about_team_list {
		grid-template-columns: 1fr;
		gap: 12px;
	}
	.about_team_list li:nth-child(1),
	.about_team_list li:nth-child(2),
	.about_team_list li:nth-child(3),
	.about_team_list li:nth-child(4),
	.about_team_list li:nth-child(5) {
		grid-column: span 1;
	}
	.about_team_list li {
		padding: 20px;
	}
	.about_team_list h4 {
		margin-top: 0;
		font-size: 20px;
		padding-bottom: 10px;
	}
	
}

#about .bg01 {
	margin-bottom: 0;
}
#about #top_philosophy {
	padding-bottom: 80px;
}
@media screen and (max-width: 640px) {
	#about #top_philosophy {
		padding-bottom: 40px;
		background: url(images/bg_01.jpg) no-repeat top left -300px;
		background-size: cover;
	}
}




/*==================================================================

		#clinic　＊　クリニック紹介

==================================================================*/

/*------------------------------ 共通 ------------------------------*/
#clinic ul.inner {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 20px;
	margin-top: 60px;
}
#clinic ul.inner img {
	width: 100%;
}
#clinic ul.inner p {
	text-align: center;
	margin: 10px 0;
}
@media (max-width: 640px) {
	#clinic ul.inner {
		grid-template-columns: repeat(2, 1fr);
		gap: 10px;
	}
	#clinic ul.inner p {
		font-size: 13px;
		margin: 5px 0;
	}
}
/*------------------------------ 医院紹介 ------------------------------*/
#clinic-info {
	margin-top: 100px;
	margin-bottom: 100px;
}

/*------------------------------ 設備紹介 ------------------------------*/
#clinic-facility {
	margin-bottom: 70px;
}

/*------------------------------ 王禅寺歯科クリニックの日常 ------------------------------*/
#clinic-life {
	margin-top: 100px;
}

/*------------------------------ スマートフォン（640px以下） ------------------------------*/
@media (max-width: 640px) {
	#clinic-info {
		margin-top: 60px;
		margin-bottom: 60px;
	}
	#clinic-facility {
		margin-bottom: 50px;
	}
	#clinic-life {
		margin-top: 60px;
	}
}







/*==================================================================

		#news　＊　お知らせ一覧

==================================================================*/
#news .inner {
	position: relative;
	width: 90%;
	max-width: 1080px;
	margin: auto;
}


/*------------------------------ ul > li ------------------------------*/
#news ul li {
	border-bottom: 1px solid #ddd;
	position: relative;
	display: flex;
	align-items: center;
	gap: 60px;
	padding: 40px 0;
	font-family: "Shippori Mincho B1", serif;
	color: #222;
	transition: 0.3s ease;
}
#news ul li dt {
	display: flex;
	align-items: center;
	gap: 30px;
	line-height: 1.8;
	margin-bottom: 20px;
	color: var(--color-gold);
	font-size: 19px;
}
#news ul li dt span {
	position: relative;
	top: 2px;
	font-family: "Cormorant Infant", serif;
	font-size: 21px;
}
#news ul li dd {
	font-size: 17px;
}
@media screen and (max-width: 640px) {
	#news ul li {
		align-items: flex-start;
		gap: 16px;
		padding: 36px 0;
	}
	#news ul li dt {
		display: flex;
		flex-direction: column;
		align-items: flex-start;
		gap: 0;
		margin-bottom: 15px;
		font-size: 18px;
	}
	#news ul li dt span {
		font-size: 18px;
	}
	#news ul li dd {
		font-size: 15px;
	}
}








/*==================================================================

		.pager　＊　ページネーション

==================================================================*/
.pager {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
}
.pager > ul {
	display: flex;
	gap: 10px;
}
.pager > ul li {
	display: block;
	border-bottom: none !important;
}
.pager > ul li a,
.pager > ul li span {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 46px;
	height: 46px;
	font-size: 17px;
	font-family: "Cormorant Infant", serif;
	transition: 0.2s;
}
.pager > ul li a {
	border: 1px solid #c7c7c7;
	color: #555;
}
.pager > ul li a:hover {
	background: var(--color-gold);
	border-color: var(--color-gold-light);
	color: #FFF;
}
.pager > ul li span.current {
	background: var(--color-gold);
	border-color: var(--color-gold-light);
	color: #FFF;
}
@media screen and (max-width: 640px) {
}

/*.pager {
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 14px;
	margin-top: 90px;
}
.pager span,
.pager a {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 46px;
	height: 46px;
	font-family: "Cormorant Infant", serif;
	font-size: 17px;
	color: #222;
	border: 1px solid #e0dbd3;
	transition: 0.3s ease;
}
.pager a:hover {
	background: #f9f7f5;
	border-color: var(--color-gold-light);
	color: var(--color-gold);
}
.pager .current {
	background: var(--color-gold);
	border-color: var(--color-gold);
	color: #fff;
}
.pager_next {
	width: auto !important;
	gap: 8px;
	padding: 0 20px;
	font-family: "Shippori Mincho B1", serif;
	font-size: 14px;
}
.pager_next span {
	width: auto;
	height: auto;
	border: none;
	font-family: "Cormorant Infant", serif;
	font-size: 16px;
}
@media screen and (max-width: 640px) {
	.pager {
		gap: 8px;
		margin-top: 60px;
	}
	.pager span,
	.pager a {
		width: 38px;
		height: 38px;
		font-size: 15px;
	}
	.pager_next {
		padding: 0 14px;
		font-size: 13px;
	}
}
*/