/* フォント全体をNoto Sans JP */
/* 色定義 */
:root {
  --defaultgray: #333;
}

  a {
    color: inherit; /* 親要素の文字色を継承 */
  }

html, body, .main-body {
  height: 100%;
}

#lenis-root{
  padding-top:60px;
}
p {
  line-height: 1.4;
  margin-bottom: 0.5rem;
}

body {
  font-family: 'Noto Sans JP', sans-serif;
  color: var(--defaultgray) !important;
  overscroll-behavior: contain;
  font-size:0.875rem;
  overflow-x: hidden; /* 横スクロールを防止 */

}

/* Bootstrap ユーティリティクラスを上書き */
.fs-1 { font-size: 2rem !important; }
.fs-2 { font-size: 1.75rem !important; }
.fs-3 { font-size: 1.5rem !important; }
.fs-4 { font-size: 1.25rem !important; }
.fs-5 { font-size: 1rem !important; }   /* 元は1.25rem（20px） */
.fs-6 { font-size: 0.8rem !important; } /* 元は1rem（16px） */


@media (min-width:992px){
  .container,.container-lg,.container-md,.container-sm{
    max-width:960px
  }
}
@media (min-width:1200px){
  .container,.container-lg,.container-md,.container-sm,.container-xl{
    max-width:1100px
  }
}
@media (min-width:1300px){
  .container,.container-lg,.container-md,.container-sm,.container-xl,.container-xxl{
    max-width:1220px
  }
}

/* 共通：リンク5 */
.custom-link {
  font-size: 0.80rem;
  color: var(--defaultgray) !important;
}
.custom-link:hover {
  background-color: #dadada; /* 薄いグレーに */
  color: #333; /* 必要なら文字色も */
}


/* 電話リンク */
.phone-link {
  font-size: 0.85rem;
  color: var(--defaultgray);
  text-decoration: none;
}

.english-link {
  font-size: 0.85rem;
  color: var(--defaultgray);
  text-decoration: none;
  background: none;
  border: none;
}

/* ナビバーの余白除去 */
.navbar {
  padding: 0 !important;
  margin: 0 !important;
}

#mobileMenu .navbar-nav {
  align-items: center;
}

footer {
  position: relative;
  z-index: 10;
}

/* リンクカラー */
.footer-link {  
  color: var(--defaultgray);
  font-size: 0.85rem;
  text-decoration: none;
}

@media (max-width: 768px) {
  .footer-link {
    color: var(--defaultgray);
    font-size: 0.7rem;
    letter-spacing: -0.05rem;
    text-decoration: none;
  }
}


.footer-link:hover {
  text-decoration: underline;
}

.copyright {
  font-size: 0.85rem;
  color: var(--defaultgray);
}


.localnav-car {
  background-image: url(../images/lnavi_about.jpg);
  background-size: cover;
  background-position: center;
  height: 263px;
}




.bg-image-darken::before {
  content: "";
  position: absolute;
  inset: 0;
  background-color: rgba(0, 0, 0, 0); /* ← 初期の暗さ */
  z-index: 1;
  pointer-events: none;
}

/* 背景を濃くする（幅が小さい時） */
@media (max-width: 768px) {
  .bg-image-darken::before {
    background-color: rgba(0, 0, 0, 0.4);
  }
}

@media (max-width: 480px) {
  .bg-image-darken::before {
    background-color: rgba(0, 0, 0, 0.5);
  }
}


/* 中身の z-index を調整 */
.bg-image-darken > * {
  position: relative;
  z-index: 2;
}

.bg-white-80 {
  background-color: rgba(255,255,255,0.80); 
}

.bg-white-60 {
  background-color: rgba(255,255,255,0.6); 
}

/*ここからサブカテゴリ用設定*/

.localnav-op,.localnav-op-mob{
  background-image: url(../images/lnavi_outpatient.jpg);
  background-size: cover;
  background-position: center;
  height: 200px;

}

.localnav-mc,.localnav-mc-mob {
  background-image: url(../images/lnavi_medicalcheckup.jpg);
  background-size: cover;
  background-position: center;
  height: 200px;

}

.localnav-ac,.localnav-ac-mob {
  background-image: url(../images/lnavi_access.jpg);
  background-size: cover;
  background-position: center;
  height: 200px;

}
.localnav-ab,.localnav-ab-mob,.localnav-faq,.localnav-faq-mob{
  background-image: url(../images/lnavi_about.jpg);
  background-size: cover;
  background-position: center;
  height: 200px;
}

.localnav-car,.localnav-car-mob {
  background-image: url(../images/lnavi_about.jpg);
  background-size: cover;
  background-position: center;
  height: 200px;
}

.localnav-news,.localnav-news-mob {
  background-image: url(../images/lnavi_news.jpg);
  background-size: cover;
  background-position: center;
  height: 200px;
}

.localnav-op-mob,.localnav-mc-mob,.localnav-ac-mob,.localnav-ab-mob,.localnav-faq-mob,.localnav-car-mob,.localnav-news-mob{
  height: 120px;
}

.a1-box-op ,.a1-box-mc ,.a1-box-ac,
.a1-box-ab,.a1-box-faq,.a1-box-car,.a1-box-news{
  width: 100%;
  height: 110%;
  position: relative;
  overflow: visible;
}
.a1-box-op-mob,.a1-box-mc-mob,.a1-box-ac-mob ,.a1-box-ab-mob,.a1-box-faq-mob,.a1-box-car-mob,.a1-box-news-mob{
  height: 120px;
  width:120px;
  position: relative;
  overflow: visible;
}

.a1-box-op ,.a1-box-op-mob{
  background-color: rgba(114,134,148, 0.84); 
}
.a1-box-mc ,.a1-box-mc-mob{
  background-color: rgba(22,76,69,0.68);
}
.a1-box-ac ,.a1-box-ac-mob{
  background-color: rgba(0,0,0,0.62); 
}
.a1-box-ab ,.a1-box-ab-mob{
  background-color: rgba(243,158,60,0.7); 
}
.a1-box-faq ,.a1-box-faq-mob{
  background-color: rgba(26, 65, 88, 0.7); 
}
.a1-box-car ,.a1-box-car-mob{
  background-color: rgba(26, 65, 88, 0.7); 
}
.a1-box-news ,.a1-box-news-mob{
  background-color: hsla(348, 45%, 36%, 0.68); 
}

.a1-text1{
  font-size: 2.5rem;
  font-weight:600;
  position: absolute;
  white-space: nowrap;
  top:34%;
  left:7%;
  z-index: 2;
}

.a1-text1-mob{
  font-size: 1.4rem;
  font-weight:600;
  position: absolute;
  white-space: nowrap;
  top:32%;
  left:10%;
  z-index: 2;
}

.a1-text2{
  font-size: 2.0rem;
  font-weight:500;
  position: absolute;
  top:54%;
  left:8%;
  white-space: nowrap;
  z-index: 2;
}

.a1-text2-mob{
  font-size: 1.3rem;
  font-weight:500;
  position: absolute;
  top:54%;
  left:11%;
  white-space: nowrap;
  z-index: 2;
}


.localnavigation {
  background-color: #fff;
  
}


.localnav-link {
  background-color: #e9e9e9;
  display: block;
  text-decoration: none;
}

/* hover時に色を変更（Bootstrap的に） */
.localnav-link:hover {
  background-color: #d9d9d9ff; /* 薄いグレーに */
  color: #000; /* 必要なら文字色も */
}

.departmentnavigation {
  background-color: none;
  
}

.localnav-department {
  background-color: #545454;
  display: block;
  text-decoration: none;
}

/* hover時に色を変更（Bootstrap的に） */
.localnav-department:hover {
  background-color: rgba(217, 217, 217, 1); /* 薄いグレーに */
  color: #fff; /* 必要なら文字色も */
}

.content {
  background-color: #e1e0dc;
  background-repeat: repeat;
  background-size: auto; /* or specify a fixed size like 100px 100px */
  background-position: top left;
}

.news_bg {
  background-color: #ffffff;
  background-repeat: repeat;
  background-size: auto; /* or specify a fixed size like 100px 100px */
  background-position: top left;
}


.section-title {
  font-size: 1.3rem;
  font-weight: 600;
  border-bottom: 2px solid var(--defaultgray); /* ラインの色・太さを指定 */
  padding-bottom: 0.2rem;        /* ラインとの間隔 */
  margin-bottom: 1rem;           /* 次の要素との間隔 */
}

.section-text {
  font-size: 1.0rem;
}

.bg-soft-blue { background-color: #405f73 !important; }
.bg-gray-default { background-color: #ededed !important; }
.bus-red{color:red}
.bus-orange{color:orange}
.bus-green{color:green}
.bus-skyblue{color:skyblue}
h2 {
  font-family: 'Noto Sans JP', sans-serif;
  font-size: 1.3rem;
  font-weight: 400;
  letter-spacing: 0.05em;
}

.pre-wrap-style {
  white-space: pre-wrap;
  word-break: break-word;
  font-family: 'Noto Sans JP', sans-serif;
  line-height: 1.4;
}

.main-visual-area {
  aspect-ratio: 1220 / 750;
  background-image: url(../images/bg_indexA_1.jpg); /* エリアの背景画像 */
  background-size: cover;
  background-position:center;
  position: relative;
  opacity: 0;
  transition: opacity 5s ease, transform 5s ease;
}

.main-visual-ct {
  background-image: url(../images/bg_indexA_1_ct.png); /* エリアの背景画像 */
  background-size: cover;
  aspect-ratio: 661 / 601;
  background-position:center;
  position: relative;
  display: none; /* スマホ版では非表示 */
  z-index:2;
}

.index-2-left-mortar {
  background-image: url(../images/bg_indexA_1_left.jpg); /* エリアの背景画像 */
  background-size: cover;
  background-position:center;
  position: relative;
  height: 600px !important;
}

.index-2-right-entrance {
  aspect-ratio: 613/ 409;
  background-image: url(../images/bg_indexA_entrance.jpg); /* エリアの背景画像 */
  background-repeat:no-repeat;
  background-position:top;
  position: relative;
}

/* スマホでは非表示 */
@media (max-width: 767px) {
  .index-2-right-entrance {
    display: none;
  }
}

/* スマホ版では画面の縦サイズに合わせる */
@media (max-width: 767px) {
  .main-visual-area {
    aspect-ratio: auto;
    height: 100vh;
  }
  
  .index-2-left-mortar {
    height: auto !important;
  }
}

/* タブレット以上で表示 */
@media (min-width: 768px) {
  .main-visual-ct {
    display: block;
  }
}

.main-visual-area.visible {
  opacity: 1;
}

.bg_indexA_roppongi{
  background-image: url(../images/bg_indexA_roppongi.jpg); 
  background-size: cover;
  background-position:top;
  position: relative;
  aspect-ratio: 611 / 750;
}

.bg_indexA_roppongi-mob{
  background-image: url(../images/bg_indexA_roppongi.jpg); 
  background-size: cover;
  background-position:top;
  position: relative;
  aspect-ratio: 611 / 750;
}

.bg_indexA_3_right {
  aspect-ratio: 613/ 409;
  background-image: url(../images/bg_indexA_3_right.jpg); 
  background-repeat:no-repeat;
  background-position:top;
  position: relative;
}

.bg_indexA_4 {
  aspect-ratio: 1220/ 750;
  height:750px;
  background-image: url(../images/bg_indexA_4.jpg); 
  background-repeat:no-repeat;
  background-position:top;
  position: relative;
}

.bg_indexA_4-mob {
  height:500px;
  background-image: url(../images/bg_indexA_4.jpg); 
  background-repeat:no-repeat;
  background-position:top;
  position: relative;
}

/* タブレットサイズでの縮小 */
@media (max-width: 991px) {
  .bg_indexA_doctors {
    width: 90%;
    left: 5%;
  }
}

/* スマホサイズでの縮小 */
@media (max-width: 767px) {
  .bg_indexA_doctors {
    width: 80%;
    left: 10%;
  }
}

/* 小さいスマホサイズでの縮小 */
@media (max-width: 480px) {
  .bg_indexA_doctors {
    width: 70%;
    left: 15%;
  }


}



.image-link-btn {
  display: inline-block;
  width: 85px;
  height: 85px;
  background-size: cover;
  background-position: center;
  text-decoration: none;
  color: white;
  border-radius: 4px;
  transition: opacity 0.3s ease;
  padding:0;

}

.image-link-btn-1{
  background-image: url(../images/bg_linkbtn_outpatient.png);
}
.image-link-btn-2{
  background-image: url(../images/bg_linkbtn_medicalcheckup.png);
  
}
.image-link-btn-3{
  background-image: url(../images/bg_linkbtn_charge.png);
}

.image-link-btn-news{
  display: inline-block;
  background-color:#853242;
  color:#fff;
  max-width: 130px;
  height: 100%;
  text-decoration:none;
  border-radius: 2px;
}

.image-link-btn-news:hover{
  opacity: 0.85;
}

.image-btn-inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  height: 100%;
  font-family: 'Noto Sans JP', sans-serif;
  font-size: 0.8rem;
  font-weight:400;
  padding:0;
}

.image-link-btn:hover {
  opacity: 0.85;
}

.image-btn-detail {
  font-size: 1.0rem;
  font-weight:500;
}

.image-btn-text-min{
  font-size: 0.8rem;
  line-height:0.8rem;
  
}
.image-btn-inner img {
  width: 34px;
  height: 34px;
  margin-bottom: 8px;
}

.link-content {
  text-align: center;
}

.link-icon {
  width: 40px;
  height: 40px;
  display: block;
  margin: 0 auto 0.5rem;
}

.link-text {
  font-size: 1.2rem;
  font-weight: bold;
  display: block;
}


/* 共通フェード設定 */
.fade-in-trigger {
  opacity: 0;
  transition: opacity 2.0s ease, transform 4s ease;
}

/* 下から上に表示 */
.fade-up {
  transform: translateY(40px);
}
.fade-in.fade-up {
  opacity: 1;
  transform: translateY(0);
}

/* 上から下に表示 */
.fade-down {
  transform: translateY(-40px);
}
.fade-in.fade-down {
  opacity: 1;
  transform: translateY(0);
}

/* 左から */
.fade-left {
  transform: translateX(-40px);
}
.fade-in.fade-left {
  opacity: 1;
  transform: translateX(0);
}

/* 右から */
.fade-right {
  transform: translateX(40px);
}
.fade-in.fade-right {
  opacity: 1;
  transform: translateX(0);
}

.fade-center {
  transform: translateX(0px);
}
.fade-in.fade-center {
  opacity: 1;
  transform: translateX(0);
}

.fade-in-trigger.delay-1 {
  transition-delay: 2.0s;
}
.fade-in-trigger.delay-2 {
  transition-delay: 2.3s;
}
.fade-in-trigger.delay-3{
  transition-delay: 2.8s;
}

.text-top-primary {
  font-size: 1.4rem; 
  color: var(--defaultgray);
  font-weight:500;
  line-height:0.1rem;
}
.text-top-secondary{
  font-size: 1.0rem;
  font-weight:200;
  line-height:2rem;
}
.text-top-third{
  color:#222;
  font-size: 0.8rem;
  font-weight:200;
}

.bg-graystone2 {
  position: relative;
  background-image: url(../images/bg_graystone2.jpg);
}


.bg-image-graystone3 {
  position: relative;
  background-image: url(../images/bg_graystone3.jpg);
}

.bg-image-graystone4 {
  position: relative;
  background-image: url(../images/bg_graystone4.jpg);
}

.bg-image-about {
  background-image: url(../images/bg_index_about.jpg);
  background-size: cover;
  background-position: center;
}

.bg-image-access {
  background-image: url(../images/bg_index_access.jpg);
  background-size: cover;
  background-position: center;
}

.bg-image-doctors {
  background-image: url(../images/bg_doctors.png);
  background-size:auto;
  background-position: left;
}

.bg-image-hirata {
  background-image: url(../images/prof_hirata_large.png);
  aspect-ratio: 986 / 485; /* 画像の元サイズに合わせて調整 */
  background-size:contain;
  background-position:left;
  background-repeat:no-repeat;

}

.plan table, thead, th, td,  tr{
  font-size:0.7rem;
  font-weight:300;
}

.text-index{
  font-family: 'Noto Serif JP';
  color:#fff;
}

.text-index-title{
  font-family: 'Noto Serif JP';
  color:#fff;
  font-weight:200;
}

.text-index-2{
  font-family: 'Noto Serif JP';  
  color:#333;
  line-height:1.7rem;
}

.text-index-title-2{
  font-family: 'Noto Serif JP';
  color:#333;
  font-weight:200;
}


.text-index-3-mob{
  font-family: 'Noto Serif JP';  
  color:#333;
  line-height:1.7rem;
}

.bg-index-3-mob{
    background-color: rgba(255,255,255,0.85); 
    position: absolute;
}

.btn-next {
  background-color: #853242;
  color: white;
  border: none;
}

.btn-next:hover {
  background-color: #814652;
  color: white;
}

.btn-news-op {
  background-color: #505d8d;
  color: white;
  border: none;
}

.btn-news-op:hover {
  background-color: #717fb0;
  color: white;
}

.btn-news-mc {
  background-color: #308577;
  color: white;
  border: none;
}

.btn-news-mc:hover {
  background-color: #0da58c;
  color: white;
}

.btn-news-all {
  background-color: #424242;
  color: white;
  border: none;
}

.btn-news-all:hover {
  background-color: #797979;
  color: white;
}

.txt-min {
  font-size: 0.75rem;
}

.bg-orange {
  background-color: #d28860;
  color: white;
  border: none;
}

/*トップページ関係 */

    #lenis-root {
  padding-top: 60px;
}

.gallery {
  position: relative;
  background: #e1e0dc;
  overflow: hidden;
  z-index: 1;
}

.gallery::before {
  content: '';
  position: absolute;
}

.panel {
  max-height: 750px !important;
  height: 750px !important;
  overflow: hidden;
}

.panel-bg {
  content: '';
  position: absolute;
  background-repeat: no-repeat;
  max-height: 750px !important;
  height: 750px !important;
}

.normal-bg{
  position: relative;
  overflow: hidden;
  margin-left: 0;
  background-size:cover;
/*  background-color: #e1e0dc;*/ 
/*  background-image: url(../images/bg_index_outcheck.jpg); */
}

.normal-textbox {
  color: #111;
  border-radius: 0;
}

.roppongi-textbox {
  background: rgba(0,0,0,0.90);
  color: #fff;
  border-radius: 0;
}

/* test要素の中心配置 */

.panel-contents,.panel-contents-2{
  display: flex;
  align-items: center;
  justify-content: center;
  width:100%;
  height:100%;
  padding:0px 5px;
}
.panel-contents-2{

  align-items:start;
  padding-top:20px;
}



/* Lenis最適化設定 */

/* html {
  scroll-behavior: auto; /* ブラウザのデフォルトスクロールを無効化 
}*/


.img-full-width {
  width: 50vw;
  margin-left: calc(-50vw + 20%);
  position: relative;
  left: 50%;
  transform: translateX(-50%);
}



/* スマホでの六本木背景画像の調整 */
@media (max-width: 768px) {
  .gallery {
    max-height: 100vh;
  }


  .panel-contents {
    padding: 0.5rem !important;
  }
  
  .text-index-2{
    font-family: 'Noto Serif JP';
    font-size: 1rem;
    font-weight: 500;
    letter-spacing: 0.05rem;
    line-height: 1.7rem;
/*    background-color:rgba(255,255,255,0.9);*/
    position: absolute;
    top: 30%;
    left: auto;
  }



  .panel-bg {
    content: '';
    position: absolute;
    background-repeat: no-repeat;
    max-height: 750px !important;
    height: 750px !important;
  }

  .text-index-3{
    font-family: 'Noto Serif JP';
    font-size: 1rem;
    line-height: 1.6rem;
  }

}
.text-index-3{
  font-family: 'Noto Serif JP';  
  color:#333;
  line-height:1.7rem;
}

.bg-index-3{
  background-color: rgba(255,255,255,0.85); 
  border-radius:3px;
/*  position: absolute;
/*  top: 10%;
/*  left:8%;
/*  width:85%;*/
}

.bg_indexA_5 {
  height:600px;
  background-image: url(../images/bg_indexA_5.jpg); 
  background-repeat:repert;
  background-position:top;
  position: relative;
  
}
@media (max-width: 480px) {
  .bg_indexA_5 {
    height:600px;
  }
  .bg-index-3{
        position: relative;
    width:85%;
  }
}
@media (min-width: 769px) {
  .bg_indexA_5 {
    height:600px;
  }
  .bg-index-3{
    position: relative;
    width:50%;
}
}

@media (max-width: 480px) {
  .gallery {
    max-height: 100vh;
  }
  
  /* さらに小さい画面での調整 */
  /* .panel {
    padding: 0.5rem !important;
  } */
  
  .text-index {
    font-size: 1.0rem !important;
    line-height: 0.6rem !important;
    padding:0.6rem;
    font-weight: 400;
    width:230px;
  }
  .panel-contents {
    padding: 0.30rem !important;
  }
  
  .text-index-2{
    font-family: 'Noto Serif JP';
    font-size: 1rem;
    font-weight: 500;
    letter-spacing: 0.05rem;
    line-height: 1.6rem;
/*    background-color:rgba(255,255,255,0.9);*/
    position: absolute;
    top: 30%;
    left: auto;
  }
  
}

/*健診利用案内*/
.medical-feature-title{
  background-color: #385D58;
}

.medical-feature-title2{
  background-color: #E9E9E9;
  color:#444444;
}

@media (max-width: 768px) {
  .medical-feature-title2{
    background-color: #385D58;
    color:#ffffff;
  }
}

.card-body{
  background-color:rgba(0, 0, 0, 0.80);
}

.card-body-white{
  background-color:rgba(255, 255, 255, 0.8);
}

.medical-feature-card {
  background-color: white;
  
}

.medical-feature-body {
  background-color: white;
  padding: 0;
}

.medical-feature-text {
  color: #444444; /* 濃いグレー */
}

/* 検査プラン投稿フォーム専用スタイル */
.medical-plan-form-body {
  background-color: white !important;
}


/* Bootstrap カードのレスポンシブ対応 */
@media (max-width: 768px) {
  .card {
    margin-bottom: 1rem !important;
  }
  
  .card .row {
    flex-direction: column !important;
  }
  
  .card .col-4 {
    width: 100% !important;
    order: 2 !important;
  }
  
  .card .col-8 {
    width: 100% !important;
    order: 1 !important;
    height: 80px !important;
  }
  
  .card-body {
    padding: 0.7rem !important;
  }
   
  .card-body h3 {
    font-size: 0.9rem !important;
  }
  
  .card-body p {
    font-size: 0.7rem !important;
  }
}

@media (max-width: 480px) {
  .card .col-8 {
    height: 60px !important;
  }
  
  .card-body {
    padding: 0.5rem !important;
  }
  
  .card-body h3 {
    font-size: 0.8rem !important;
  }
  
  .card-body p {
    font-size: 0.6rem !important;
  }

}

/* Mac版Chrome専用 */
@media screen and (-webkit-min-device-pixel-ratio: 0) {
  /* Mac版Chrome専用の調整 */
}

/* ======= ここからcard-profileクラス定義 ======= */
.card-profile {
  position: relative;
  height:auto;
  border: 0;
  overflow: hidden;
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
  background-color: transparent;
}

.card-profile::before {
  content: '';
  display: block;
  width: 100%;
  aspect-ratio: 986 / 485; /* 画像の元サイズに合わせて調整 */
}

.card-profile .text-area {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  padding: 0.75rem 0 0 0;
  text-align: center;
  /* 親要素の横幅を超えないように */
  width: 100%;
  box-sizing: border-box;
}

.card-profile .text-area h3 {
  font-weight: 400;
  font-size: 1.2rem;
  display: inline-block;
  background: rgba(255,255,255,0.8);
  border-radius: 2px;
  padding: 0.25em 0.8em;
  margin-bottom: 0.5em;
}

.card-profile .text-area p {
  background: rgba(255,255,255,0.8);
  padding: 0.65rem 1rem;
  font-weight:300;
  margin: 0 auto;
  text-align: left;
  border-radius: 0 0 4px 4px;
  width: 100%;
  box-sizing: border-box;
}

/* スマホ版ではcard-profileのテキスト部分のみ非表示 */
@media (max-width: 768px) {
  .card-profile .text-area {
    display: none;
  }
}

/* レスポンシブ対応（デスクトップ・タブレットのみ） */
@media (min-width: 769px) {
  .card-profile .text-area h3 {
    font-size: 1.2rem;
  }
  .card-profile .text-area p {
    font-size: 1rem;
  }
}

/* スマホ版用の代替表示スタイル */
.card-profile-mobile {
  display: none;
  background-color: white;
  padding: 1rem;
  margin-top: 1rem;
  border-radius: 4px;
  box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

.card-profile-mobile h3 {
  font-weight: 400;
  font-size: 1.2rem;
  margin-bottom: 0.5rem;
  color: #333;
}

.card-profile-mobile p {
  font-weight: 300;
  font-size: 1rem;
  line-height: 1.6;
  color: #333;
  margin-bottom: 0;
}

/* スマホ版で代替表示を有効化 */
@media (max-width: 768px) {
  .card-profile-mobile {
    display: block;
  }
  
  .card-profile-mobile h3 {
    font-size: 1rem;
  }
  
  .card-profile-mobile p {
    font-size: 0.875rem;
  }
}

@media (max-width: 480px) {
  .card-profile-mobile h3 {
    font-size: 0.875rem;
  }
  
  .card-profile-mobile p {
    font-size: 0.75rem;
  }
}

/* ======= 言語切り替え用スタイル ======= */
.content-en {
  display: none;
}

.content-ja {
  display: block;
}

/* 英語表示時 */
body.lang-en .content-en {
  display: block;
}

body.lang-en .content-ja {
  display: none;
}

/* 言語切り替えボタン */
.lang-switch {
  background: none;
  border: 1px solid #333;
  padding: 5px 10px;
  border-radius: 3px;
  cursor: pointer;
  font-size: 0.8rem;
  transition: all 0.3s ease;
}

.lang-switch:hover {
  background-color: #333;
  color: white;
}

.lang-switch.active {
  background-color: #333;
  color: white;
}

/* プランセクション用のスタイル */
section[style*="width: 48%"] {
  width: 48% !important;
  display: inline-block !important;
}

@media (max-width: 768px) {
  section[style*="width: 48%"] {
    width: 100% !important;
    margin-bottom: 1rem !important;
  }
}

@media (max-width: 576px) {
  section[style*="width: 48%"] {
    width: 100% !important;
    margin-bottom: 1rem !important;
  }
}

/* ======= 画像サイズ調整用クラス ======= */
.responsive-image {
  width: 100%;
  height: auto;
  max-width: 515px;
}

/* デスクトップサイズ */
@media (min-width: 1200px) {
  .responsive-image {
    max-width: 600px;
  }
}

/* タブレットサイズ */
@media (max-width: 1199px) and (min-width: 768px) {
  .responsive-image {
    max-width: 450px;
  }
}

/* スマホサイズ */
@media (max-width: 767px) {
  .responsive-image {
    max-width: 350px;
  }
}

/* 小さいスマホサイズ */
@media (max-width: 480px) {
  .responsive-image {
    max-width: 280px;
  }
}

/* 電話番号カード用スタイル */
.phone-card {
  background-color: #ffffff !important;
  border: 1px solid #dee2e6;
  transition: all 0.3s ease;
  padding:2px;
  margin:0;
  border-radius:5px;
}

.phone-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1) !important;
}

.phone-card .card-body {
  background-color: #ffffff;
  color: #333;
  padding:0;
  margin:0;

}

.phone-card .phone-icon {
  font-size: 1.3rem;
  color: #333;
}

.phone-card .phone-title {
  font-size: 0.8rem;
  font-weight: 400;
  color: #555;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
  padding:0 2px;
}

.phone-card .phone-number {
  font-size: 1.3rem;
  font-weight: 500;
  color: #333;
  margin:0;

  text-align: left;
}
.phone-card .reception {
  font-size: 0.80rem;
  font-weight: 200;
  color: #333;
  margin:0 1px 0 0;
  line-height:1rem;
  text-align: left;
}

.phone-number-highlight {
  color: #006400;
}

/* レスポンシブ対応 */
@media (max-width: 767px) {

  .phone-card .card-body {
    background-color: #ffffff;
    color: #333;
    text-align:center;
  }

  .phone-card .phone-icon {
    font-size: 1.0rem;
    padding:3px;
    text-align:center;
  }
  
  .phone-card .phone-title {
    font-size: 1.0rem;
    padding:0;
    margin:0;
    font-weight:400;
    text-align:center;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 2px;
  }
  
  .phone-card .phone-number {
    font-size: 0.9rem;
    text-align:center;
  }
  .phone-card .reception {
    font-size: 0.8rem;
    text-align:center;
  }
  
  /* クリニック紹介とアクセスのカードの高さを半分に */
  .card[style*="background-image: url"] {
    height: 50px !important;
  }
  
  /* スマホでカード間の隙間を減らす */
  .phone-card {
    margin-bottom: 0.5rem !important;
  }
  
  .card[style*="background-image: url"] {
    margin-bottom: 0.5rem !important;
  }
}