:root {
  --base-orenge: #e5b58a;
  --deep-orenge: #f19a4e;
  --accent-blue: #4c5c75;
  --navy-blue: #7d8ea9;
  --light-blue: #dee0e3;
  --light-orenge:#fff5e8;
  --text-dark: #1b1b1b;
  --text-light: #ffffff;
  --shadow-blue: rgba(48, 123, 199, 0.4);
}

/* 共通 */
.w95 {
    width: 90%;
    padding: 0 3%;
    margin: 0 auto;
    text-align: left;
}
.w65 {
  width: 65%;
  margin: 0 auto;
}
.under_wrap {
  width: 85%;
  margin: 0 auto;
}

.txt_center {
  text-align: center;
}
.under_underline {
  padding-bottom: 2px;
  border-bottom: 1.5px solid #3a8dde;
}

/* h2 */
.medical-h2 {
  background-color: var(--base-orenge);
  text-align: center;
  color: #fff;
  font-size: 230%;
  font-weight: normal;
  letter-spacing: .05em;
  line-height: 1.6em;
  padding: .5em 3%;
  margin-bottom: 60px;
}

/* h3 */
.medical-h3 {
  color: var(--deep-orenge);
  border-bottom: 1px solid var(--base-orenge);
  padding-bottom: 15px;
  margin: 20px 0;
  font-size: 1.5rem;
}

/* h4 */
.medical-h4 {
  font-size: 20px;
  line-height: 1.3;
  /* font-weight: bold; */
  margin-bottom: 10px;
  padding-left: 15px;
  border-left: #3396e2 solid 5px;
}

/* 下層(こだわりページ用)見出し */
.under-ttlbloc {
  margin: 30px auto;
}
.underttl {
  font-size: max(2.274vw, 37px);
  color: #69492a;
  line-height: 1.4;
  margin-bottom: 15px;
  text-shadow: 1px 1px 4px rgba(255, 255, 255, 0.6);
  position: relative;
  text-align: center;
  margin: 10px 0 30px;
}
.underttl .mini {
  font-size: 25px;
}
.under-ttlbloc p {
  text-align: center;
}
.under-ttlbloc p .underline {
  text-decoration: none;
  border-bottom: 2px solid var(--color-accent);
}
.underttlspan {
      font-size: 57px;
    background: var(--gradient-shiny-orange);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-weight: 600;
    color: transparent;
    text-shadow: none;
}

.lead {
  text-align: center;
}

/* -----------------------------------------
モバイル版
----------------------------------------- */
@media (max-width: 768px) {
  .under_wrap {
  width: 100%;
}
  .nomalunder {
    padding: 50px 15px;
  }
  .w95 {
    width: 100%;
    padding: 0;
  }
  .w65 {
    width: 90%;
    margin: 0 auto;
  }
  .underttlspan {
      font-size: 30px;
}
.lead {
  text-align: left;
}
.feature .idx_lst li em {
    font-size: 17px;
}
.feature .idx_lst li::before {
    font-size: 15px;
    top: 0px;
}
.feature .idx_lst li {
    padding-left: 0;
}
.medical-h2 {
  font-size: 150%;
  margin-bottom: 20px;
}
}

/* ---------------------------------------リスト--------------------------------------- */

/* リスク・注意点リスト */
.risk-list {
  list-style: none;
  margin: 20px 0;
  padding: 20px 25px;
  background: #f0f6fc; /* 淡い青背景 */
  border-left: 4px solid #4a90e2; /* 青いラインでアクセント */
}

.risk-list li {
  position: relative;
  padding-left: 28px;
  margin-bottom: 10px;
  line-height: 1.6;
  color: #333;
}

.risk-list li:last-child {
  margin-bottom: 0;
}

/* 擬似要素でアイコンを作成 */
.risk-list li::before {
  content: "⚠"; /* 注意アイコン */
  position: absolute;
  left: 0;
  top: 0;
  font-size: 16px;
  color: #4a90e2;
  line-height: 1.6;
}

/* リスト */
.aftercare-list {
  list-style: none;
  margin: 20px 0;
  padding: 0;
}

.aftercare-list li {
  position: relative;
  padding-left: 28px;
  margin-bottom: 12px;
  line-height: 1.6;
}

/* チェック風アイコン */
.aftercare-list li::before {
  content: "✔";
  position: absolute;
  left: 0;
  top: 0;
  color: #4a90e2; /* 明るい青で安心感 */
  font-weight: bold;
  font-size: 16px;
  line-height: 1.6;
}

.aftercare-list li:last-child {
  margin-bottom: 0;
}

/* simpleリスト */
.bgli {
  background: var(--light-orenge);
	padding: 10px;
}
.simple-feature-list {
  list-style: none;
  padding: 20px;
  line-height: 1.8;
  margin: 10px 0;
}

.simple-feature-list li {
  position: relative;
  padding-left: 1.5em;
  margin-bottom: 12px;
}

.simple-feature-list li::before {
  content: "■";
  position: absolute;
  left: 5px;
  top: 0.1em;
  color: var(--accent-blue);
  font-size: 0.8em;
}
.bak_1 {
    background: url(../images/under/bk_1.png) no-repeat top center / 100%;
    aspect-ratio: 1500 / 850;
    box-sizing: border-box;
}
@media (max-width: 768px) {
	bak_1{
		padding:10px;
	}
}



/* ---------------------------------------button--------------------------------------- */
/* ボタンの中央寄せ用ラッパ */
.btn-center {
  text-align: center; /* インライン要素を中央揃え */
  margin: 30px 0;    /* 上下に余白 */
}

/* 丸みボタン */
.btn-blue {
  display: inline-block;
  padding: 12px 28px;
  background: var(--accent-blue);
  color: #fff;
  font-weight: bold;
  font-size: 16px;
  text-decoration: none;
  border-radius: 50px;
  transition: 0.3s;
  box-shadow: 0 4px 12px var(--shadow-blue);
}

/* ホバー時の動き */
.btn-blue:hover {
  background: var(--navy-blue);
  box-shadow: 0 6px 16px var(--light-blue);
  transform: translateY(-2px);
  color: #fff;
}
/* ---------------------------------------button2--------------------------------------- */
.cta-buttons {
  margin-top: 20px;
  display: flex;
  gap: 15px;
  flex-wrap: wrap;
}

.btn {
  background-color: var(--accent-blue);
  color: #fff;
  padding: 12px 24px;
  border-radius: 30px;
  text-decoration: none;
  transition: 0.3s;
}

.btn:hover {
  background-color: #6091c9;
  color: #fff;
}

.btn.light {
  background-color: #fff;
  color: var(--accent-blue);
  border: 2px solid var(--accent-blue);
}

.btn.light:hover {
  background-color: #e9f0f8;
}

/*------------------------------------- 下層ヘッダー --------------------------------------*/

.under_head {
  height: 70vh;
}
.under_head {
    position: relative;
    z-index: 0;
    width: 100%;
    height: 50vw;
    max-height: 480px;
    background-image: url(../images/under/under_head.png);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
}
.under_head::before {
    content: "";
    position: absolute;
    z-index: 0;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    background: linear-gradient(0deg, rgba(0, 0, 0, 0) 20%, rgba(0, 0, 0, 1) 80%);
    opacity: 0.05;
}
.under_ttl {
    position: absolute;
    z-index: 1;
    margin: auto;
    left: 0;
    right: 0;
    top: 55%;
    transform: translateY(50%);
    color: #fff;
    width: 100%;
    padding-bottom: 20px;
    padding-left: 20px;
    border-bottom: 1px solid #fff;
}
.under_ttlp {
  color: #fff;
  font-size: 300%;
  letter-spacing: .1em;
  line-height: 1.2em;
}
@media (max-width: 768px) {
	.under_ttlp {
		font-size: 130%;
	}
}


/*------------------------------------- 下層リード文 --------------------------------------*/
.flex_wrap {
  background: #fffbf6;
  padding: 15px;
  margin: 20px 0;
}

.under_flex_box {
  display: flex;
}
.txt_box {
  flex:3;
  padding: 15px;
  margin: auto;
}
.img_box {
  flex: 2;
  padding: 15px;
  margin: auto;
}
/* -----------------------------------------
モバイル版
----------------------------------------- */
@media (max-width: 768px) {
  .under_flex_box {
    display: flex;
    flex-direction: column;
  }
  .img_box {
    order: 1;
    padding: 0;
  }
  .txt_box {
    order: 2;
    padding: 0;
  }
}

/*------------------------------------- 背景ありのflex --------------------------------------*/
.flowbg .under_flex_box {
  background: #e2e8f36e;
  margin: 10px 0;
}
/*------------------------------------- 治療の流れ --------------------------------------*/

.flow_box {
  margin: 20px 0 50px;
}

.flow_box {
  background: var(--light-orenge);
  padding: 50px 20px;
}

.flow_box h3 {
  color: #9a845c;
  border-bottom: 1px solid #d2c3a1;
  font-size: 1.7rem;
  margin-bottom: 20px;
  padding: 10px 0;
}
ul.medical-flow.com_btm_100 {
    padding-bottom: 60px;
}
.medical-flow > li {
	position: relative;
	box-sizing: border-box;
	width: 100%;
	padding-left: 100px;
	padding-bottom: 60px;
}
.medical-flow li:last-of-type {
	padding-bottom: 0;
}
.medical-flow > li::before,
.medical-flow > li::after {
	content: "";
	position: absolute;
	top: 0;
	font-family: quiche-stencil, sans-serif;
	font-weight: 100;
	font-style: normal;
	text-align: center;
	color: #956f38;
	font-size: 220%;
	line-height: 1.0em;
}
.medical-flow > li::before {
	z-index: 1;
	content: "1";
	width: 1.5em;
	line-height: 1.5em;
	background: #fff;
	border: 1px solid #956f38;
	border-radius: 50%;
	left: 0;
}
.medical-flow > li:nth-child(2)::before { content: "2"; }
.medical-flow > li:nth-child(3)::before { content: "3"; }
.medical-flow > li:nth-child(4)::before { content: "4"; }
.medical-flow > li:nth-child(5)::before { content: "5"; }
.medical-flow > li:nth-child(6)::before { content: "6"; }
.medical-flow > li:nth-child(7)::before { content: "7"; }
.medical-flow > li:nth-child(8)::before { content: "8"; }
.medical-flow > li::after {
	z-index: 0;
	width: 1px;
	height: 100%;
  left: 0.75em;
	background-color: #c6c2bf;
}
.medical-flow li:last-of-type::after {
	display: none;
}
.medical-flow .img_r {
	width: 35.5%;
	max-width: 394px;
}

.medical-flow .implant_style1 > dt {
  font-size: 1.5rem;
	padding-top: 0.6em;
  padding-bottom: 0.6em;
	color: #956f38;
}
.medical-flowinner.clearfix {
  display: flex;
  /* flex-direction: row-reverse;  */
  align-items: flex-start;
  gap: 20px; 
}

.medical-flow .img_r {
  width: 35.5%;
  max-width: 394px;
}

.medical-flow .txt_l {
  padding: 0 15px;
  flex: 3;
}

.flow_box .grid_box1{
  flex-direction: row-reverse; 
  box-shadow:none;
  background: none;
}
.medical-flow {
  flex: 3;
}
.grid_img_box {
    width: 40%;
}
/* インプラントページ用 */
.flow_box.implant {
    background: #ffffff78;
    width: 80%;
    margin: auto;
}
.implantflow {
  background: url(../images/under/implantflowbg.png) no-repeat top center / 100%;
  padding-top: max(5.714vw, 74px);
  box-sizing: border-box;
  width: 100%;
  aspect-ratio: 1400 / 1927;
}

/* ----------------------------------------------------
スマホ用（〜767px）
---------------------------------------------------- */
@media (max-width: 768px) {
  .flow_box {
  margin: 20px 0;
}

.flow_box {
  background: #f0f6fc;
	padding: 50px 10px;
}

.flow_box h3 {
  color: #9a845c;
  border-bottom: 1px solid #d2c3a1;
  font-size: 1.7rem;
  margin-bottom: 20px;
  padding: 10px 0;
}
ul.medical-flow.com_btm_100 {
    padding-bottom: 60px;
}
.medical-flow > li {
	position: relative;
	box-sizing: border-box;
	width: 100%;
	padding-left: 50px;
	padding-bottom: 60px;
}
.medical-flow li:last-of-type {
	padding-bottom: 0;
}
.medical-flow > li::before,
.medical-flow > li::after {
	content: "";
	position: absolute;
	top: 0;
	font-family: quiche-stencil, sans-serif;
	font-weight: 100;
	font-style: normal;
	text-align: center;
	color: #956f38;
	font-size: 220%;
	line-height: 1.0em;
}
.medical-flow > li::before {
	z-index: 1;
	content: "1";
  width: 1.2em;
  line-height: 1.2em;
	background: #fff;
	border: 1px solid #956f38;
	border-radius: 50%;
	left: 0;
}
.medical-flow > li:nth-child(2)::before { content: "2"; }
.medical-flow > li:nth-child(3)::before { content: "3"; }
.medical-flow > li:nth-child(4)::before { content: "4"; }
.medical-flow > li:nth-child(5)::before { content: "5"; }
.medical-flow > li:nth-child(6)::before { content: "6"; }
.medical-flow > li:nth-child(7)::before { content: "7"; }
.medical-flow > li:nth-child(8)::before { content: "8"; }
.medical-flow > li::after {
	z-index: 0;
	width: 1px;
	height: 100%;
  left: 0.6em;
	background-color: #c6c2bf;
}
.medical-flow li:last-of-type::after {
	display: none;
}
.medical-flow .img_r {
	width: 35.5%;
	max-width: 394px;
}

.medical-flow .implant_style1 > dt {
	font-size: 1.1rem;
	padding-top: 0.6em;
  padding-bottom: 0.6em;
	color: #956f38;
	display: flex;
	align-items: center;
}
.medical-flowinner.clearfix {
  display: flex;
  align-items: flex-start;
  flex-direction: column;
}

.medical-flow .img_r {
  width: 35.5%;
  max-width: 394px;
}

.medical-flow .txt_l {
  /* padding: 0 15px; */
  flex: 3;
  order: 2;
}

.flow_box .grid_box1{
  flex-direction: row-reverse; 
  box-shadow:none;
  background: none;
}
.medical-flow {
  flex: 3;
}
.grid_img_box {
    order: 1;
}
.grid_img_box {
    width: 100%;
}
.implantflow {
  padding: 0 10px;
}
.flow_box.implant {
  width: 100%;
}
}
/*------------------------------------- 表 --------------------------------------*/
/* 表全体の余白とレスポンシブ用ラッパー */
.table-wrap {
  overflow-x: auto;
  margin: 20px 0;
}

/* 治療費用テーブル */
.cost-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 14px;
  min-width: 600px; /* スマホで横スクロール */
}

/* ヘッダー */
.cost-table thead th {
  background: var(--accent-blue);
  color: #fff;
  text-align: center;
  padding: 12px;
  font-weight: bold;
  border: 1px solid #ddd;
}
.cost-table.invi thead th {
  width: 50%;
}

/* ボディ */
.cost-table tbody td {
  border: 1px solid #ddd;
  padding: 12px;
  line-height: 1.6;
}

/* 偶数行の背景色を淡くする */
.cost-table tbody tr:nth-child(even) td {
  background: var(--light-blue)
}

/* 注意書き */
.note {
  font-size: 12px;
  color: #666;
  margin-top: 10px;
}

/* スマホ時は文字サイズ少し小さめに */
@media (max-width: 768px) {
  .cost-table {
    font-size: 13px;
  }
  .cost-table thead th,
  .cost-table tbody td {
    padding: 10px;
  }
}
/*------------------------------------- チェックリスト --------------------------------------*/
.check-section {
  margin: 60px auto;
  max-width: 1000px;
}

.check-container {
  border: 1px solid #cce0eb;
  padding: 40px 30px 0;
  background: #f9fdfd;
}

.checkttl {
  text-align: center;
  font-size: 1.6rem;
  color: #123456;
  margin-bottom: 30px;
}

.check-container h2 .sub {
  display: block;
  font-size: 0.9rem;
  color: #666;
  margin-bottom: 8px;
}

.check-icon {
  color: #4c5c75;
  font-size: 1.8rem;
  margin-left: 5px;
}

.check-list {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 15px 40px;
  margin-bottom: 30px;
}

.check-list li {
  list-style: none;
  position: relative;
  padding-left: 28px;
  color: #003366;
}

.check-list li::before {
  content: "✔";
  color: #4c5c75;
  position: absolute;
  left: 0;
  top: 0;
}

.check-footer {
  background: #e6f3f8;
  text-align: center;
  padding: 15px;
  font-size: 0.95rem;
  color: #225577;
  margin: 0 -30px -1px; /* 左右いっぱいに広げる */
}

/* ----------------------------------------------------
スマホ用（〜767px）
---------------------------------------------------- */
@media (max-width: 768px) {
.check-container {
  padding: 40px 10px 0;
}

.checkttl {
  text-align: center;
  font-size: 1.3rem;
  margin-bottom: 30px;
}

.check-container h2 .sub {
  display: block;
  font-size: 0.9rem;
  margin-bottom: 8px;
}

.check-icon {
  font-size: 1.8rem;
  margin-left: 5px;
}

.check-list {
  display: grid;
  grid-template-columns: repeat(1, 1fr);
  gap: 15px 40px;
  margin-bottom: 30px;
}

.check-list li {
  list-style: none;
  position: relative;
  padding-left: 28px;
}

.check-list li::before {
  position: absolute;
  left: 0;
  top: 0;
}

.check-footer {
  text-align: center;
  padding: 15px;
  font-size: 0.95rem;
  margin: 0 -10px;
}
}

/*------------------------------------- よくある質問 --------------------------------------*/

.faqsec {
  background: url(../images/under/bk_4.png) no-repeat top center / 100%;
    width: 100%;
    aspect-ratio: 1400 / 800;
    box-sizing: border-box;
    padding: max(4.786vw, 62px) max(9.571vw, 124px) 0;
    margin-bottom: max(0.857vw, 11px);
}
.faq-item {
  margin-bottom: 10px;
  border-radius: 2px;
  overflow: hidden;
}

.faq-question {
  width: 100%;
  background-color: #e3e6e9;
  color: var(--accent-blue);
  font-size: 1.2rem;
  font-weight: 500;
  border: none;
  padding: 5px 10px;
  text-align: left;
  display: flex;
  justify-content: space-between;
  align-items: center;
  cursor: pointer;
}
.qst {
  font-size: 1.2rem;
}
.faq-question .q-icon {
    font-size: 1.5em;
    color: var(--accent-blue);
    margin-right: 0.4em;
    display: inline-block;
}

.faq-toggle-icon {
  display: inline-block;
  transition: transform 0.3s ease;
}

.faq-question.active .faq-toggle-icon {
  transform: rotate(180deg);
}


.faq-answer {
  background: #fffbf4;
  padding: 1em 2em;
  display: none;
}

.faq-answer p {
  margin: 0;
  line-height: 1.6;
}
a.faqlink {
  display: inline-block;
  background: rgba(83, 102, 135, .95);
  color: #fff;
  padding: 10px 20px;
  margin-top: 10px;
  text-decoration: none;
}
.a-icon {
  font-size: 1.5em;
  color: var(--color-accent);
  margin-right: 0.4em;
  display: inline-block;
}
/* ----------------------------------------------------
スマホ用（〜767px）
---------------------------------------------------- */
@media (max-width: 768px) {
.faqsec {
  padding: 10px 15px;
}
.qst {
    font-size: 1rem;
}
}
/*------------------------------------- よくある質問 --------------------------------------*/


/* -------------------------------------当院の特徴(インプラント)------------------------------------- */

/* セクションの背景 */
.feature {
  padding: 95px 0;
  position: relative;
  background: linear-gradient(to right, rgba(255, 255, 255, 1) 0%, rgba(246, 241, 234, 0.9) 20%, /* #eaf0f6（明るめ）*/ rgba(250, 248, 245, 0.9) 80%, /* #f5f7fa（ほぼ白）*/ rgba(255, 255, 255, 1) 100%);
  z-index: 0;
  overflow: hidden;
}

.feature::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 80px;
  background: linear-gradient(to bottom, rgba(255, 255, 255, 1), rgba(255, 255, 255, 0));
  z-index: 1;
}

.feature::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 80px; 
  background: linear-gradient(to top, rgba(255, 255, 255, 1), rgba(255, 255, 255, 0));
  z-index: 1;
}

.idx_inr {
  position: relative;
  display: block;
  margin: 0 auto;
}

.idx_box {
  display: block;
  position: relative
}

.idx_lst li {
  position: relative;
  display: block;
  padding-left: 1em;
  margin-bottom: .5em;
  background-repeat: no-repeat;
  background-position: 0 .4em;
  background-size: .8em auto
}

.feature .idx_inr {
  max-width: 1400px;
  width: 100%;
  padding: 36px 0;
  margin-bottom: 30px;
  background-repeat: no-repeat;
  background-size: auto 100%;
  background-color: #fff;
  background-position: 100% 0
}

.feature .idx_inr:nth-of-type(2),
.feature .idx_inr:nth-of-type(4){
  background-position: 0 0;
}

.feature .idx_box {
  color: #2e2e2e;
  background-color: #ffffff61;
  box-shadow: 3px 3px 5px rgba(162,162,162,.2);
  max-width: 858px;
  margin: 0 auto 0 0;
  padding: 30px 24px 24px 65px;
}

.feature .idx_inr:nth-of-type(2) .idx_box {
  box-shadow: -3px 3px 5px rgba(162,162,162,.2);
  margin: 0 0 0 auto
}
.feature .idx_inr:nth-of-type(4) .idx_box {
  box-shadow: -3px 3px 5px rgba(162,162,162,.2);
  margin: 0 0 0 auto
}

.feature_ttl {
  position: relative;
  font-size: 26.87px;
  margin: 0 0 24px;
  border-bottom: 1px solid #977c4c;
  color: var(--color-emphasis);
}
.feature_ttl span{
  font-size: 35px;
  color: var(--color-ttl);
    text-shadow: 1px 1px 4px rgba(74, 105, 189, 0.6);

}
  
.feature_ttl:before {
  content: "";
  display: block;
  position: absolute;
  width: 99px;
  aspect-ratio: 1/1;
  left: -45px;
  top: -24px;
  background-repeat: no-repeat;
  background-size: 100% 100%;
}
.featurettl01:before{
  background-image: url(../images/top/h-img.png);
  background-repeat: no-repeat;
}
.featurettl02:before{
  background-image: url(../images/top/h-img2.png);
  background-repeat: no-repeat;
}
.featurettl03:before{
  background-image: url(../images/top/h-img3.png);
  background-repeat: no-repeat;
}

.feature_lead {
  display: flex;
  align-items: center;
  padding: 0 0 16px;
  margin: 0 auto 15px 0;
  /* width: 60%; */
}

.feature_lead p {
  display: block;
}

.feature_lead p i {
  display: block
}

.feature_lead p .ja {
  font-size: 27.52px
}

.feature_lead p .en {
  font-size: 39.63px;
  font-weight: 700
}

.feature_lead figure {
  flex: 1
}

.feature .idx_lst {
  font-size: 15px
}
.feature .idx_lst li {
  line-height: 1.3;
  /* letter-spacing: -.06em */
}
.feature .idx_lst li::before {
  content: "●";
  font-size: 20px;
  color: #f7961d;
  margin-right: 10px;
  position: relative;
  top: 3px;
}
.feature01 li {
    background-image: url(../images/top/check.png);
    background-repeat: no-repeat;
    line-height: 1.3;
    /* letter-spacing: -.06em; */
}
.feature02 li {
  background-image: url(../images/top/check2.png);
  background-repeat: no-repeat;
  line-height: 1.3;
  /* letter-spacing: -.06em */
}
.feature03 li {
  background-image: url(../images/top/check3.png);
  background-repeat: no-repeat;
  line-height: 1.3;
  /* letter-spacing: -.06em */
}

.feature .idx_lst li span {
  display: block
}
.feature .idx_lst li em {
    font-weight: 600;
    font-size: 19px;
}
.feature01 li em{
  color: #f7961d;
}
.feature02 li em{
    color: #f7961d;
}
.feature03 li em{
    color: #f7961d;
}
.feature04 li em{
  color: #f7961d;
}

.feature_fig {
  position: absolute
}

.feature .idx_gnr_btn {
  width: unset;
  left: unset;
  right: 36px;
  bottom: 20px
}

.feature .idx_gnr_01 {
  background-image: url(../images/under/feature01.png);
  background-repeat: no-repeat;
}


.feature .idx_gnr_01 .feature_lead p {
  margin-right: 42px
}

.feature .idx_gnr_01 .feature_lead figure img {
  width: 109px;
  aspect-ratio: 109/149
}

.idx_gnr_01 .idx_lst li:nth-of-type(3) {
  /* padding-left: .8em */
}

.idx_gnr_01 .feature_fig {
  width: 366px;
  bottom: 40px;
  right: 0px;
}

.idx_gnr_01 .feature_fig img {
  aspect-ratio: 366/272;
  padding: 10px;
}

.feature .idx_gnr_02 {
  background-image: url(../images/under/feature02.png);
  background-repeat: no-repeat;
}

.feature .idx_gnr_02 .feature_lead p {
  margin-right: 36px
}

.feature .idx_gnr_02 .feature_lead figure img {
  width: 103px;
  aspect-ratio: 103/138
}

.feature .idx_gnr_02 .idx_lst li:nth-of-type(2) span:nth-of-type(2) {
  margin-left: -.4em
}

.feature .idx_gnr_02 .feature_fig {
  width: 366px;
    bottom: 40px;
    right: 0px;
}

.feature .idx_gnr_02 .feature_fig img {
  aspect-ratio: 378/269
}

.feature .idx_gnr_03 {
  background-image: url(../images/under/feature03.png);
  background-repeat: no-repeat;
}


.feature .idx_gnr_03 .feature_lead p {
  margin-right: 30px
}

.feature .idx_gnr_03 .feature_lead figure img {
  width: 117px;
  aspect-ratio: 117/144
}

.feature .idx_gnr_03 .idx_lst li:nth-of-type(2),.idx_gnr_03 .idx_lst li:nth-of-type(3) {
  padding-left: 1em
}

.feature .idx_gnr_03 .feature_fig {
  width: 366px;
    bottom: 11px;
    right: 0px;
}

.feature .idx_gnr_03 .feature_fig img {
  aspect-ratio: 377/269
}


.feature .idx_gnr_04{
  background-image: url(../images/under/feature04.png);
  background-repeat: no-repeat;
}
.feature .idx_gnr_04 .feature_lead p {
  margin-right: 30px
}

.feature .idx_gnr_04 .feature_lead figure img {
  width: 117px;
  aspect-ratio: 117/144
}

.feature .idx_gnr_04 .idx_lst li:nth-of-type(2),.idx_gnr_04 .idx_lst li:nth-of-type(3) {
  padding-left: 1em
}

.feature .idx_gnr_04 .feature_fig {
  width: 366px;
    bottom: 40px;
    right: 0px;
}

.feature .idx_gnr_04 .feature_fig img {
  aspect-ratio: 377/269
}


.feature .idx_gnr_05{
  background-image: url(../images/under/feature05.png);
  background-repeat: no-repeat;
}
.feature .idx_gnr_05 .feature_lead p {
  margin-right: 30px
}

.feature .idx_gnr_05 .feature_lead figure img {
  width: 117px;
  aspect-ratio: 117/144
}

.feature .idx_gnr_05 .idx_lst li:nth-of-type(2),
.idx_gnr_05 .idx_lst li:nth-of-type(3) {
  padding-left: 1em
}

.feature .idx_gnr_05 .feature_fig {
  width: 366px;
    bottom: 40px;
    right: 0px;
}

.feature .idx_gnr_05 .feature_fig img {
  aspect-ratio: 377/269
}


/*------------------------------
ボタン
------------------------------*/

.btn03 {
  position: relative;
}
.btn03 a {
  display: inline-block;
  position: relative;
  min-width: 250px;
  box-sizing: border-box;
  padding: 17px 38px 17px 25px;
  margin: 20px 0;
  line-height: 1;
  border-radius: 40px;
  text-align: left;
  font-weight: bold;
  text-decoration: none;
  font-size: 15px;
}
.btn03 a:hover::before {
  right: 20px;
}

.btn03 a:hover::before{
	right: 20px;
}

.btn03 a:hover::after{
	left:0;
	top:0;
}
.btn03 a i{
	margin-right: 7px;
	font-size: 12px;
}
/* 一つ目のボタン */
.featurebtv01 a {
	border: 1px solid var(--color-emphasis2);
    color: var(--color-emphasis2);
    transition: background-color 1s ease, color 1s ease;
}
.featurebtv01 a:hover {
	color: #fff;
	background:var(--color-emphasis);
}

/* 二つ目のボタン */
.featurebtv02 a {
  border: 1px solid var(--color-emphasis2);
    color: var(--color-emphasis2);
    transition: background-color 1s ease, color 1s ease;
}
.featurebtv02 a:hover {
	color: #fff;
	background:var(--color-emphasis);
}

/* 三つ目のボタン */
.featurebtv03 a {
	border: 1px solid var(--color-emphasis2);
    color: var(--color-emphasis2);
    transition: background-color 1s ease, color 1s ease;
}

.featurebtv03 a:hover{
	color: #fff;
	background:var(--color-emphasis);
}


/* 四つ目のボタン */
.featurebtv04 a {
	border: 1px solid var(--color-emphasis2);
    color: var(--color-emphasis2);
    transition: background-color 1s ease, color 1s ease;
}

.featurebtv04 a:hover{
	color: #fff;
	background:var(--color-emphasis);
}

/* ----------------------------------------------------
タブレット用（768px〜1024px）
---------------------------------------------------- */
/* ----------------------------------------------------
スマホ用（〜767px）
---------------------------------------------------- */
@media (max-width: 768px) {
	.feature {
		padding: 0;
	}
	.underttl {
		font-size: 1.5rem;
	}
	.under-ttlbloc p {
		/* text-align: left; */
		padding: 0 8px;
	}
  .feature .idx_inr {
    padding: 10px;
    background-position: 0 0;
  }
  .feature .idx_box {
  padding: 10px;
  background-color: #ffffffde;
}
.feature_ttl {
  font-size: 1.2rem;
}
.feature_ttl span {
    font-size: 1.5rem;
}
.feature_lead {
    width: 100%;
}
.idx_gnr_01 .feature_lead p {
  margin: 0;
}
.feature_fig {
  position: relative;
}
.idx_gnr_01 .feature_fig,
.idx_gnr_02 .feature_fig,
.idx_gnr_03 .feature_fig,
.idx_gnr_04 .feature_fig,
.idx_gnr_05 .feature_fig {
  width: 100%;
  bottom: 0;
  margin: 0 0 20px;
}
.featurebtv01 a,
.featurebtv02 a,
.featurebtv03 a,
.featurebtv04 a {
  display: block;
  text-align: center;
}
.idx_gnr_02 .feature_lead p,
.idx_gnr_03 .feature_lead p,
.idx_gnr_04 .feature_lead p {
  margin-right: 0;
}
.feature .idx_lst li em {
    font-size: 17px;
}
.feature .idx_lst li::before {
    font-size: 15px;
    top: 0px;
}
.feature .idx_lst li {
    padding-left: 0;
}
.feature .idx_gnr_03 .idx_lst li:nth-of-type(2), .idx_gnr_03 .idx_lst li:nth-of-type(3),
.feature .idx_gnr_04 .idx_lst li:nth-of-type(2), .idx_gnr_04 .idx_lst li:nth-of-type(3),
.feature .idx_gnr_05 .idx_lst li:nth-of-type(2), .idx_gnr_05 .idx_lst li:nth-of-type(3){
  padding-left: 0;
}
.feature .idx_inr:nth-of-type(2), .feature .idx_inr:nth-of-type(4) {
    background-position: 100% 0;
}
}


/* ラッパー */
.implant-wrapper {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 30px;
	margin: 40px 0;
	width: 90%;
	margin: 0 auto;
	width: 70%;
}

/* 各アイテム */
.implant-item {
  text-align: center;
  background: #fff;
  border: 1px solid #eee;
  /* border-radius: 12px; */
  padding: 20px;
  box-shadow: 0 4px 8px rgba(0,0,0,0.05);
  transition: transform 0.3s ease;
}

/* 画像 */
.implant-item img {
  width: 100%;
  height: auto;
  margin-bottom: 15px;
}

/* 見出し */
.implant-item h3 {
  font-size: 1.2rem;
  margin-bottom: 10px;
  color: #333;
}

/* テキスト */
.implant-item p {
  font-size: 0.95rem;
  color: #555;
  line-height: 1.6;
  text-align: left;
}

/* スマホ対応 */
@media (max-width: 768px) {
  .implant-wrapper {
    grid-template-columns: 1fr;
	  width: 100%;
  }
}

/*-------------------------------------- メリットデメリット --------------------------------------*/
.meritdemert {
  background: url(../images/under/bk_2.png) no-repeat top center / 100%;
    width: 100%;
    aspect-ratio: 1400 / 1200;
    box-sizing: border-box;
    padding: max(4.786vw, 62px) max(9.571vw, 124px) 0;
    margin-bottom: max(0.857vw, 11px);
}
.meritdemert.kotuzou {
  background: none;
  aspect-ratio: none;
}
:root {
  --accent: #0f2a43;     /* 紺 */
  --accent-weak: #183b5e;
  --accent-ghost: #e9eef6;
  --warn: #e26600;       /* オレンジ */
  --warn-weak: #ff8a2a;
  --warn-ghost: #fff2e8;
  --ink: #223;
  --muted: #5a6370;
  --surface: #fff;
  --shadow: 0 6px 20px rgba(0,0,0,.08);
}

/* テーマ切替 */
.pros-cons.theme--orange{
  --accent: #e26600;
  --accent-weak: #cf5b00;
  --accent-ghost: #fff2e8;
  --warn: #0f2a43;
  --warn-weak: #183b5e;
  --warn-ghost: #e9eef6;
}

.pc-lead{
  color: var(--muted);
  line-height: 1.8;
  max-width: 760px;
  margin: 0 auto 14px;
}

/* Section titles */
.pc-section-title{
  margin: 28px 0 14px;
  font-size: clamp(16px, 1.8vw, 20px);
  font-weight: 800;
  display: inline-flex;
  align-items: center;
  gap: .6em;
  padding: 8px 14px;
  border-radius: 999px;
  background: var(--accent-ghost);
  color: var(--accent-weak);
}
.pc-section-title--cons{
  background: var(--warn-ghost);
  color: var(--warn-weak);
}

/* Grid */
.pc-grid{
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  gap: 14px;
  margin-bottom: 18px;
}
@media (max-width: 920px){
  .pc-grid{ 
    grid-template-columns: repeat(6, 1fr); 
  }
}
@media (max-width: 640px){
  .pc-grid{ 
    grid-template-columns: repeat(1, 1fr); 
  }
}

/* Cards */
.pc-card{
  grid-column: span 4;
  background: var(--surface);
  padding: 18px 18px 16px;
  box-shadow: var(--shadow);
  border: 1px solid rgba(0,0,0,.04);
  position: relative;
  overflow: clip;
}
@media (max-width: 920px){ 
  .pc-card{ 
    grid-column: span 6; 
  } 
}
@media (max-width: 640px){ 
  .pc-card{ 
    grid-column: span 1; 
  } 
}

/* Accent tabs */
.pc-card::before{
  content: "";
  position: absolute;
  inset: 0 0 auto 0;
  height: 6px;
  background: var(--accent);
  opacity: .16;
}
.pc-card--pro::before{ background: var(--accent); opacity: .26; }
.pc-card--con::before{ background: var(--warn);   opacity: .26; }

/* Titles */
.pc-card__title{
  font-size: 16px;
  font-weight: 800;
  color: var(--ink);
  margin: 6px 0 6px;
  padding-left: 12px;
  position: relative;
}
.pc-card__title::before{
  content:"";
  position:absolute;
  left:0; top:.4em;
  width:6px; height:1.2em;
  border-radius: 3px;
  background: linear-gradient(180deg, #4c5c75, var(--accent-weak));
}
.pc-card--con .pc-card__title::before{
  background: linear-gradient(180deg, var(--warn), var(--warn-weak));
}

/* Body */
.pc-card__text{
  color: var(--muted);
  line-height: 1.9;
  font-size: 14.5px;
}

/* Note */
.pc-note{
  margin: 8px 0 0;
  font-size: 12.5px;
  color: var(--muted);
  text-align: right;
  opacity: .9;
}

/* Motion (控えめ／環境配慮) */
@media (prefers-reduced-motion: no-preference){
  .pc-card{
    transition: transform .25s ease, box-shadow .25s ease;
  }
}
/* -----------------------------------------
モバイル版
----------------------------------------- */
@media (max-width: 768px) {
  .meritdemert {
    padding: 0 15px;
  }
}
/*-------------------------------------- 骨造成ブロック --------------------------------------*/
:root{
  --navy: #0f2a43;
  --navy-2:#173a5b;
  --navy-ghost:#e9eef6;
  --orange:#e26600;
  --orange-2:#c95500;
  --orange-ghost:#fff2e8;
  --ink:#22262b;
  --muted:#5a6370;
  --surface:#fff;
  --radius:18px;
  --shadow:0 10px 26px rgba(0,0,0,.10);
}
.graft-section{ 
  padding: 0 15px;
  color:var(--ink); 
  font-family:system-ui,-apple-system,"Segoe UI",Roboto,"Hiragino Kaku Gothic ProN","Noto Sans JP","Yu Gothic",Meiryo,sans-serif; 
}
.graft-section.theme--navy{
  --accent: var(--navy);
  --accent-2: var(--navy-2);
  --ghost: var(--navy-ghost);
  --cta: #fff;
}
.graft-section.theme--orange{
  --accent: var(--orange);
  --accent-2: var(--orange-2);
  --ghost: var(--orange-ghost);
  --cta: #fff;
}

/* ===== Hero ===== */
.graft-hero{ position:relative; overflow:hidden; border-radius: calc(var(--radius) + 6px); }
.graft-hero__bg{
  width:100%; height:280px; object-fit:cover; display:block; filter:saturate(80%);
}
.graft-hero__overlay{
  position:absolute; inset:0;
  background:
    linear-gradient(0deg, rgba(255,255,255,.9), rgba(255,255,255,.85)),
    radial-gradient(1200px 220px at 50% -180px, var(--ghost), transparent 60%);
}
.graft-hero__inner{
  position:absolute; inset:0;
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  padding:24px; text-align:center;
}
.graft-eyecatch{
  width:64px; height:64px; border-radius:50%;
  background:var(--accent); color:#fff; display:grid; place-items:center;
  box-shadow:var(--shadow); margin-bottom:10px;
}
.graft-eyecatch svg{ width:32px; height:32px; }
.graft-title{
  font-size: clamp(22px, 2.6vw, 30px); font-weight:800; color:var(--accent); margin:6px 0 8px;
}
.graft-lead{
  max-width:780px; color:var(--muted); line-height:1.9; margin:0 auto 14px; padding:0 12px;
}
.graft-cta{
  display:inline-block; padding:12px 22px; border-radius:999px;
  background:linear-gradient(180deg, var(--accent), var(--accent-2));
  color:var(--cta); font-weight:800; text-decoration:none; box-shadow:var(--shadow);
}
@media (prefers-reduced-motion:no-preference){
  .graft-cta{ 
    transition: transform .18s ease, box-shadow .18s ease, filter .18s ease; 
  }
  .graft-cta:hover{ 
    transform: translateY(-1px); filter:brightness(1.05); 
    box-shadow:0 12px 28px rgba(0,0,0,.12); 
  }
}

/* ===== Body ===== */
.graft-body{ max-width:1080px; margin:22px auto 0; padding:0 20px 24px; }
.graft-grid{
  display:grid; grid-template-columns: repeat(12, 1fr); gap:16px; margin-top:16px;
}
@media (max-width: 920px){ .graft-grid{ grid-template-columns: repeat(6, 1fr); } }
@media (max-width: 640px){ .graft-grid{ grid-template-columns: repeat(1, 1fr); } }

.graft-card2 {
grid-column: span 6;
  background:var(--surface); 
  /* padding:18px 18px 16px;  */
  overflow:hidden;
  position:relative;
}
.graft-card{
  grid-column: span 6;
  background:var(--surface); 
  border:1px solid rgba(0,0,0,.05);
  padding:18px 18px 16px; 
  box-shadow:var(--shadow); 
  overflow:hidden; 
  position:relative;
  margin: auto;
}

.graft-card__title{
  font-size:18px; font-weight:800; margin:6px 0 8px; color:var(--ink);
  padding-left:12px; position:relative;
}
.graft-card__title::before{
  content:""; 
  position:absolute; 
  left:0; 
  top:.35em; 
  width:6px; 
  height:1.2em; 
  /* background: linear-gradient(180deg, var(--accent), var(--accent-2)); */
}
.graft-card__text{ color:var(--muted); line-height:1.9; }
.graft-list{ margin:10px 0 0 1em; color:var(--ink); }
.graft-list li{ margin:.25em 0; }

/* methods */
.graft-methods{ display:grid; gap:10px; }
.method{
  background: var(--ghost); border:1px solid rgba(0,0,0,.04); border-radius:12px; padding:12px 14px;
}
.method__tag{
  display:inline-block; font-size:12px; font-weight:800; letter-spacing:.02em;
  padding:4px 10px; border-radius:999px; color:#fff; background:linear-gradient(180deg, var(--accent), var(--accent-2));
}
.method__desc{ margin:.4em 0 0; color:var(--muted); line-height:1.8; }

/* ===== Info media box ===== */
.graft-info{
  margin-top:18px;
  align-items:center; 
  background: var(--ghost); 
  border-radius:var(--radius); 
  padding:14px;
}
.graft-info__media img{ width:100%; height:100%; max-height:260px; object-fit:cover; border-radius:12px; display:block; }
.graft-info__text h4{ margin:.2em 0 .3em; font-size:16.5px; font-weight:800; color:var(--accent-2); }
.graft-info__text p{ color:var(--muted); line-height:1.9; }
@media (max-width: 800px){
  .graft-info{ grid-template-columns: 1fr; }
  .graft-info__media img{ max-height:220px; }
}

/* -------------------------------------Allon4ブロック------------------------------------- */
.allon-section {
background: url(../images/under/bk_3.png) no-repeat top center / 100%;
    width: 100%;
    aspect-ratio: 1400 / 800;
    box-sizing: border-box;
    padding: max(4.786vw, 62px) max(9.571vw, 124px) 0;
    margin-bottom: max(0.857vw, 11px);
}


.allon-label {
  font-size: 14px;
  color: #666;
  letter-spacing: .08em;
  margin-bottom: 6px;
}

/* ===== 本文ブロック ===== */
.allon-body {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 32px;
  align-items: center;
}
@media (max-width: 820px) {
  .allon-body {
    grid-template-columns: 1fr;
    gap: 24px;
  }
}

.allon-text p {
  margin-bottom: 1em;
  line-height: 1.9;
  font-size: 16px;
  color: #444;
}
.allon-media img {
  width: 100%;
  max-width: 460px;
  display: block;
  margin: 0 auto;
}

/* ===== CTAボタン ===== */
.allon-cta {
  display: inline-block;
  margin-top: 12px;
  padding: 14px 26px;
  border-radius: 999px;
  background: linear-gradient(180deg, #0f2a43, #183b5e);
  color: #fff;
  font-weight: 700;
  text-decoration: none;
  box-shadow: 0 8px 20px rgba(0,0,0,.12);
}
.allon-cta:hover {
  filter: brightness(1.06);
  transform: translateY(-2px);
  transition: .2s ease;
}

/* -----------------------------------------
モバイル版
----------------------------------------- */
@media (max-width: 768px) {
.allon-section {
  padding: 0 15px;
}
.allon-media {
  order: 1;
}
.allon-text {
  order: 2;
}
}

/* ---------------------------------------審美歯科ページ--------------------------------------- */
/* ===== Theme (オレンジ基調) ===== */
:root{
  --main:#E96A00;         /* 濃いめのオレンジ */
  --accent:#FF8A1E;       /* アクセント */
  --ink:#232323;          /* 文字色 */
  --muted:#6f6f6f;        /* 補助文字 */
  --bg:#FFF7EF;           /* うすいオレンジ系背景 */
  --line:#FFE1C7;         /* 罫線色 */
}

/* ===== Columns ===== */
.row2{
  display:grid;
  grid-template-columns: repeat(2, 1fr);
  gap: clamp(16px, 2.4vw, 28px);
}
.col{
  background:#fff;
  padding: clamp(18px, 2.6vw, 26px);
  border:1px solid var(--line);
  /* 角丸禁止 → 角を残したまま“角型シャドウ” */
  box-shadow: 8px 8px 0 0 #ffe3d0;
}

/* 見出し：角丸なしの帯＋角カット風アクセント */
.labelh3{
  font-size: clamp(18px, 2.4vw, 22px);
  margin:0 0 12px;
  line-height:1.4;
}
.labelh3 span{
  padding:8px 10px 6px 12px;
  background: linear-gradient(90deg, var(--accent), #FFC48F);
  color:#fff;
  display:inline-block;
  font-weight:700;
  box-shadow: inset 0 -4px 0 rgba(0,0,0,.06);
  position: relative;
}
.labelh3 span::before{
  /* 左端の角張ったマーカー */
  content:"";
  position:absolute;
  left:-8px; top:0; bottom:0;
  width:8px;
  background: var(--main);
}

/* ===== Responsive ===== */
@media (max-width: 800px){
  .row{ grid-template-columns:1fr; }
  .btn{ width:100%; text-align:center; }
}

/*------------------------------------- 経歴 --------------------------------------*/

/* Grid */
.doctor-profile__grid {
  display: grid;
  gap: 20px;
}
@media (min-width: 880px) {
  .doctor-profile__grid {
    grid-template-columns: 1fr 1fr;
  }
}

/* Blocks */
.doctor-profile__block {
  background: #ffffff;
  border: 1px solid #003366; /* 紺色枠 */
  padding: 20px;
  box-shadow: 0 2px 6px rgba(0,0,0,0.08);
  transition: background 0.2s ease;
}
.doctor-profile__block.matop {
  margin-top: 20px;
}

/* Subtitle */
.doctor-profile__subtitle {
  font-size: 1.1rem;
  margin: 0 0 15px;
  padding-left: 12px;
  border-left: 5px solid #ff6600; /* オレンジライン */
  color: #003366; /* 紺 */
  font-weight: 600;
}

/* List */
.doctor-profile__list {
  list-style: disc inside;
  margin: 0;
  padding: 0;
  color: #333;
}
.doctor-profile__list li {
  line-height: 1.8;
  margin: 0.25em 0;
}

/* 学会リストは2カラム */
.doctor-profile__list--cols {
  column-gap: 40px;
}

/* 追加部分 */
.greeting__speciality {
  margin-top: 30px;
  padding: 15px 20px;
  border-left: 5px solid #4c5c75;
  background: #fef6f0;
}

.greeting__subtitle {
  font-size: 1.2rem;
  margin: 0 0 10px;
  color: #4c5c75;
  font-weight: bold;
}

.greeting__speciality ul {
  margin: 0;
  padding-left: 18px;
}

.greeting__speciality li {
  position: relative;
  padding-left: 1.4em; /* ●分のスペースを確保 */
  margin: 5px 0;
  line-height: 1.6;
}

.greeting__speciality li::before {
  content: "●";
  position: absolute;
  left: 0;
  top: 0;
  color: #4c5c75;
  font-size: 0.9em;
  line-height: 1.6;
}
@media (min-width: 880px) {
  .doctor-profile__list--cols {
    columns: 2;
  }
}
@media (max-width: 768px) {
  .greeting__speciality ul {
    padding-left: 0;
}
}
/*------------------------------------- 料金表 --------------------------------------*/

.group {
  margin: 24px 0 32px;
}

.group__title {
  font-size: 1.15rem;
  font-weight: 700;
  color: var(--navy);
  margin: 0 0 12px;
  border-left: 4px solid #e3aa81;
  padding-left: 10px;
}

.list {
  list-style: none;
  margin: 0;
  padding: 0;
  border-top: 1px solid var(--rule);
}

.list li {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 16px;
  padding: 10px 0;
  border-bottom: 1px solid #d4ddeb;
  line-height: 1.6;
}

.list li span:first-child {
  overflow-wrap: anywhere;
}

.yen {
  color: #4c5c75;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}
.under_wrap.price {
    background: #fff7eea6;
    padding: 20px;
    width: 90%;
    margin: 0 auto;
}
/* スマホ対応 */
@media (max-width: 640px) {
  .list li {
    grid-template-columns: 1fr;
    gap: 4px;
  }
  .yen {
    justify-self: end;
  }
  .under_wrap.price {
    width: 100%;
  }
}
/*------------------------------------- 医院紹介 --------------------------------------*/
/*------------------------------------- 医院情報（おしゃれ表） --------------------------------------*/
.clinic-table {
  width: 100%;
  border-collapse: collapse;
  margin: 30px auto;
}

.clinic-table .row {
  display: flex;
  border-bottom: 1px solid #f0f0f0;
}

.clinic-table .row:last-child {
  border-bottom: none;
}

.clinic-table .cell {
  padding: 18px 20px;
  line-height: 1.7;
}

.clinic-table .heading {
  width: 28%;
  background: #faf7f6;
  font-weight: 600;
  color: #333;
  display: flex;
  align-items: center;
  gap: 8px;
  border-right: 1px solid #f0eaea;
}

.clinic-table .heading i {
  color: #e07a5f; /* アクセントカラー（落ち着いた赤系） */
  font-size: 1.1rem;
}

.clinic-table .content {
  width: 72%;
  color: #555;
}

.clinic-table a {
  color: #e07a5f;
  text-decoration: none;
  font-weight: 500;
}

.clinic-table a:hover {
  text-decoration: underline;
}
.clinic-video {
  position: relative;
  padding-bottom: 56.25%; /* 16:9 の比率 */
  height: 0;
  overflow: hidden;
  margin-top: 20px;
}

.clinic-video iframe {
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 60%;
  height: 60%;
  border: 0;
}


/* スマホ対応 */
@media (max-width: 768px) {
  .clinic-table .row {
    flex-direction: column;
  }
  .clinic-table .heading {
    width: 100%;
    border-right: none;
    border-bottom: 1px solid #f0eaea;
    border-radius: 10px 10px 0 0;
  }
  .clinic-table .content {
    width: 100%;
  }
  .clinic-video iframe {
  width: 100%;
  height: 100%;
}
}
/*------------------------------------- オールオン4ページ --------------------------------------*/
/* ===== Theme Vars（色はここで一括変更） ===== */
.trouble {
  --c-bg: #f7f9fc;
  --c-card: #fff;
  --c-text: #273245;
  --c-accent: #f7961d;      /* アイコンのブランドオレンジ */
  --c-accent-weak: #ffe9cc; /* アイコン背景の淡色 */
  --c-shadow: 0 10px 24px rgba(18, 38, 63, .08);
  --radius: 16px;
  /* background: linear-gradient(180deg, var(--c-bg), #fff 65%); */
  padding: 48px 0;
  aspect-ratio: 1500 / 850;
}

/* Container */
.trouble__inner { width: min(1100px, 92%); margin: 0 auto; }

/* Grid（PC3 / Tab2 / SP1） */
.trouble__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 22px;
}
@media (max-width: 900px) {
  .trouble__grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 520px) {
  .trouble__grid { grid-template-columns: 1fr; }
}

/* Card */
.trouble__card {
  background: var(--c-card);
  padding: 22px 18px 20px;
  text-align: center;
  box-shadow: var(--c-shadow);
  transition: transform .2s ease, box-shadow .2s ease;
  outline: none;
}
/* .trouble__card:hover,
.trouble__card:focus-within {
  transform: translateY(-3px);
  box-shadow: 0 14px 28px rgba(18, 38, 63, .12);
} */

/* Icon（丸背景＋中央アイコン） */
.trouble__icon {
  width: 64px; height: 64px;
  margin: 0 auto 14px;
  border-radius: 50%;
  background: radial-gradient(ellipse at 30% 30%, var(--c-accent-weak), #fff 70%);
  display: grid; place-items: center;
  border: 1px solid rgba(247,150,29,.2);
}
.trouble__icon i {
  font-size: 26px;
  color: var(--c-accent);
}

/* Text */
.trouble__text {
  font-size: 1rem;
  color: var(--c-text);
  line-height: 1.7;
  letter-spacing: .01em;
}


/* ============== CF7 予約フォーム調整（追加・上書き） ============== */

/* テーブルの安定化＆カラム比率 */
table.mousikomi{
  width:100%;
  table-layout: fixed;          /* 長文で崩れない */
  border-collapse: separate;
}
.mousikomi td{ 
  vertical-align: top;          /* ラベルと入力のズレ防止 */
  padding: 20px 15px;
  word-break: break-word;
}
.mousikomi td.yoyaku{
  width: 28%;                   /* 1列目：やや細め */
  background:#f1d4ad;
  color:#fff;
  border:0.5px solid #fff;
  padding: 25px;
}
.mousikomi td:nth-child(2){ 
  width: 72%;                   /* 2列目：入力側を広く */
}

/* wrapをブロック化して横幅を持たせる（このフォームに限定） */
.mousikomi .wpcf7-form-control-wrap{
  display:block !important;
  max-width:100%;
  box-sizing:border-box;
}

/* テキスト・メール・TEL・テキストエリア共通の見た目 */
.mousikomi input[type="text"],
.mousikomi input[type="email"],
.mousikomi input[type="tel"],
.mousikomi textarea{
  width:100%;
  box-sizing:border-box;
  padding: 10px 12px;
  border: 1px solid #dcdcdc;
  border-radius: 6px;
  line-height: 1.6;
  background:#fff;
}
.mousikomi textarea{
  min-height: 180px;
  resize: vertical;
}

/* 月/日/時間のセレクトの並びと余白（既存指定を少し整える） */
.wpcf7-form .mousikomi select{
  display:inline-block;
  height: 32px;
  margin: 0 6px 12px 8px;
  padding: 4px 6px;
  vertical-align: middle;
}

/* チェックボックスの1行を読みやすく */
.contact-check .wpcf7-list-item{
  display:block;
  margin-top: 6px;
  line-height: 1.7;
}

/* 必須バッジの小さな角丸＆フォント微調整 */
.sankou { font-size:70%; background-color:#E67E22; /* オレンジ */ color:#fff; padding:3px 4px; margin:0 5px; white-space: nowrap; } .sankou.blue { background-color:#1A237E; } /* 紺色 */ .mousikomi { margin-top:20px; }

/* 送信ボタン：ホバー/フォーカス、モバイルは幅100% */
#mail_submit2{
  background:#efa649;
  color:#fff;
  border:none;
  border-radius: 8px;
  padding: 12px 20px;
  cursor:pointer;
  transition: filter .2s ease, transform .02s ease-in-out;
}
#mail_submit2:hover{ filter: brightness(0.95); }
#mail_submit2:active{ transform: translateY(1px); }
@media (max-width:768px){
  #mail_submit2{ width:100%; }
}

/* フォーカス・バリデーションの見た目（アクセシビリティ） */
.mousikomi input[type="text"]:focus,
.mousikomi input[type="email"]:focus,
.mousikomi input[type="tel"]:focus,
.mousikomi textarea:focus,
.mousikomi select:focus{
  outline: none;
  border-color: #efa649;          /* オレンジ */
  box-shadow: 0 0 0 3px rgba(239,166,73,.18);
}
.wpcf7 form.invalid .wpcf7-not-valid{
  border-color:#d93025;
  box-shadow: 0 0 0 3px rgba(217,48,37,.12);
}
.wpcf7 form .wpcf7-response-output{
  margin: 12px 0 0;
  padding: 10px 12px;
  border-radius:6px;
}

/* スマホ：縦積み・余白最適化 */
@media (max-width: 768px){
  .mousikomi tbody tr{ display:block; margin-bottom: .8em; }
  .mousikomi tbody td{ display:block; width:auto; border:none; padding:12px 10px; }
  .mousikomi td.yoyaku{ 
    width:auto; 
    border:none;
    border-radius:8px;
    margin-bottom:8px;
  }
  .wpcf7-textarea{ width:100%; }
}

/* 微調整：ラベル文字の整列/余白 */
.yoyaku .b{ 
  display:inline-block; 
  font-weight:700; 
  letter-spacing:.02em;
}
.mousikomi p{ margin:0 0 8px; }

@media only screen and (max-width:420px){
    .mousikomi tbody tr{
        display: block;
        border: none;
        margin-bottom: 0.8em;
    }
    .mousikomi tbody td{
        display: block;
        border: none;
        padding: 10px;
    }
    .wpcf7-textarea {width: 100%; }
    .mousikomi table tr td,
    .mousikomi {border: none; }
    .mousikomi td { width: auto;}
}
.wpcf7 .wpcf7-form-control-wrap {
	display: inline-block !important; 
}
.center {
  text-align: center;
}
.kyukan {
    text-align: center;
    font-size: 1.3rem;
    color: #E67E22; /* オレンジ */
}
@media only screen and (max-width:768px){
    .kyukan {
        text-align: left;
        font-size: 1rem;
        color: #E67E22; /* オレンジ */
    }
}

/* thanksページ */
.thanks_box {
  background: #f1d4ad;
  padding: 20px;
}
html {
	margin-top:0!important;
}
/* --------------------
   コラム見出しデザイン
-------------------- */
.columnpage section {
	padding:0;
}
/* h2 見出し */
.column-content h2,
.news-content h2 {
  background: #fff7f2; /* 淡いオレンジ背景 */
  border-left: 6px solid #f7931e; /* 濃いオレンジライン */
  color: #333;
  font-size: 1.6rem;
  font-weight: bold;
  padding: 12px 16px;
  margin: 40px 0 20px;
  border-radius: 4px;
}

/* h3 見出し */
.column-content h3,
.news-content h3 {
  position: relative;
  padding-left: 14px;
  margin: 30px 0 15px;
  font-size: 1.3rem;
  font-weight: bold;
  color: #444;
}

.column-content h3::before,
.news-content h3::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.4em;
  width: 6px;
  height: 1.2em;
  background: #f8b862; /* 淡いオレンジ */
  border-radius: 3px;
}

/* h4 見出し */
.column-content h4,
.news-content h4 {
  font-size: 1.1rem;
  font-weight: bold;
  color: #555;
  border-bottom: 2px solid #fdd9b5; /* 薄オレンジ下線 */
  display: inline-block;
  padding-bottom: 4px;
  margin: 20px 0 10px;
}
/* 2カラムレイアウト */
.layout-2col {
  display: grid;
  grid-template-columns: 1fr;
  gap: 24px;
	width: min(75%, 92%);
  margin: 40px auto;
}

@media (min-width: 960px) {
  .layout-2col {
    grid-template-columns: minmax(0, 1fr) 300px; /* 本文 / サイドバー */
    gap: 32px;
  }
}

/* サイドバー */
.column-sidebar {
  background: #fff7f2;           /* 淡いオレンジ */
  border: 1px solid #fde3d2;     /* 薄い枠 */
  border-radius: 8px;
  padding: 16px;
}

.sidebar-section + .sidebar-section {
  margin-top: 20px;
}

.sidebar-ttl {
  font-size: 1.1rem;
  font-weight: 700;
  color: #333;
  border-left: 6px solid #f7931e; /* 濃いオレンジのアクセント */
  padding-left: 10px;
  margin: 0 0 12px;
}

.sidebar-list {
  list-style: none;
  margin: 0;
  padding: 0;
}

.sidebar-list li {
  border-bottom: 1px dashed #f5c8a8;
}

.sidebar-list li a {
  display: block;
  padding: 10px 6px;
  text-decoration: none;
  color: #444;
  transition: background-color .2s ease, padding-left .2s ease;
}

.sidebar-list li a:hover {
  background: #fff1e7;
  padding-left: 12px;
}

/* 検索フォーム（テーマの既存スタイルがあれば不要） */
.column-sidebar .search-form {
  display: flex;
  gap: 8px;
}

.column-sidebar .search-form .search-field {
  flex: 1;
  border: 1px solid #e9bfa1;
  border-radius: 6px;
  padding: 8px 10px;
}

.column-sidebar .search-form .search-submit {
  border: none;
  background: #f7931e;
  color: #fff;
  padding: 8px 12px;
  border-radius: 6px;
  cursor: pointer;
}
.news-backlist {
    margin: 30px 0;
}
/* ===========================
  お知らせ一覧（Simple）
  色はここだけで調整
=========================== */
:root {
  --primary: #f7961d;
  --text: #222;
  --muted: #666;
  --border: #e5e7eb;
  --bg-soft: #f7f9fc;
}
main.main.page {
    max-width: 1300px;
    margin: 30px auto;
}
/* レイアウト */
.content-sidebar-wrapper {
  display: grid;
  grid-template-columns: 2fr 1fr; /* メイン:サイド = 2:1 */
  gap: 20px;
}

.contentout, .sidebar { width: 100%; }

/* カード */
.news-card {
  border: 1px solid var(--border);
  border-radius: 10px;
  background: #fff;
  overflow: hidden;
  margin-bottom: 16px;
}

.news-card__link {
  display: grid;
  grid-template-columns: 180px 1fr;
  gap: 16px;
  text-decoration: none;
  color: inherit;
}

.news-card__thumbnail { background: #fff; }
.news-card__thumbnail-image {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.news-card__thumbnail-placeholder {
  display: flex; align-items: center; justify-content: center;
  min-height: 120px;
  background: var(--bg-soft);
  color: var(--muted);
  font-size: 14px;
}

.news-card__content {
  padding: 14px 14px 14px 0;
  display: grid;
  align-content: center;
  gap: 6px;
}

.news-card__title {
  font-size: 18px;
  font-weight: 700;
  line-height: 1.4;
  margin: 0;
}

.news-card__date {
  font-size: 13px;
  color: var(--muted);
}

.news-card__more {
  display: inline-block;
  font-size: 14px;
  font-weight: 700;
  color: #fff;
  background: var(--primary);
  border-radius: 999px;
  padding: 8px 14px;
  width: fit-content;
}

/* ホバー（控えめ） */
.news-card__link:hover .news-card__more { opacity: .9; }
.news-card__link:hover .news-card__title { text-decoration: underline; text-underline-offset: 2px; }



/* ページネーション */
.pagination, .nav-links { margin-top: 20px; display: flex; gap: 8px; flex-wrap: wrap; }
.page-numbers {
  border: 1px solid var(--border);
  padding: 6px 10px;
  border-radius: 6px;
  text-decoration: none;
  color: var(--text);
  font-size: 14px;
}
.page-numbers.current {
  background: var(--primary);
  color: #fff;
  border-color: var(--primary);
}
.page-numbers:hover { border-color: var(--primary); }

/* レスポンシブ */
@media (max-width: 960px) {
  .content-sidebar-wrapper {
    grid-template-columns: 1fr;
  }
  .news-card__link {
    grid-template-columns: 140px 1fr;
  }
}

@media (max-width: 640px) {
  .news-card__link {
    grid-template-columns: 1fr; /* サムネ上・本文下に縦並び */
  }
  .news-card__content { padding: 12px; }
  .news-card__title { font-size: 16px; }
}
.footer * .note {
    color: #fff;
}