/* ===================================================================
   ファイル: style.css (安全整形・章立てコメント付き)
   生成日: 2025-08-15
   方針: セレクタ順・宣言順・カスケードは保持。可読性のためのコメントのみ追加。
   注意: レイアウトや動作には影響しません。
   目次 (検索の目印):
     01. 左ナビ / Navigation
     02. メインエリア / Main
     03. Information セクション
     04. レスポンシブ: max-width 768px
     05. @media (max-width: 768px) {.card {
     06. ふぁみコネについて / About
     07. @media (max-width: 768px) {.friend-container {
     08. @media (max-width: 600px) {.line-qr-row {
     09. COLUMN（読み物）
     10. @media (max-width: 768px) {.column-content img {
     11. 会社情報 / Company
     12. お問い合わせ / Contact
     13. @media (max-width: 768px) {.company-main {
     14. フッター
     15. @media (max-width: 768px) {.column-content {
     16. もっと見るボタン
     17. @media (max-width: 768px) {.company-message-wrapper {
     18. トップに戻る（タブ風ボタン）
     19. キャラクターカード（グリッド）
     20. ======= LINE 友だち登録カード =======
     21. レスポンシブ: max-width 820px
     22. @media (max-width: 820px) {.friend .friend-container {
     23. レスポンシブ: screen and (max-width: 787px)
     24. @media screen and (max-width: 787px) {.drug-table {
     25. レスポンシブ: max-width 840px
     26. @media (max-width: 840px) {.video-thumb,
     27. @media (max-width: 840px) {
     28. @media (max-width: 840px) {
     29. @media (max-width: 840px) {.hero {
     30. about画像をスマホ時はテキストの背景にする
     31. @media (max-width: 840px) {.about-container {
   （エディタで『#region』を検索すると主要セクションにジャンプできます）
   =================================================================== */
* {
  font-family: 'UDDigiKyokasho R JIS2004', sans-serif;
  font-size: 1.1rem;
}
body {
  margin: 0;
  font-family: 'UDDigiKyokasho R JIS2004', sans-serif;
  line-height: 1.6;
  background: #fff;
  color: #333;
}/* 左ナビ */
/* #region 左ナビ / Navigation */
    nav {
  position: fixed;
  top: 0;
  left: 0;
  width: 240px;
  height: 100vh;
  background-color: #fff;
  border-right: 2px solid #f1a950;
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 1rem 0;
  z-index: 1000;
    box-shadow: 4px 0 12px rgba(0,0,0,.15);
}.nav-logo img {
  width: 150px;
  margin-bottom: 2rem;
}nav ul {
  list-style: none;
  padding: 0;
  margin: 0;
}nav li {
  margin-bottom: 1.5rem;
}nav li a {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-decoration: none;
  color: #333;
  font-size: 1rem;
  font-family: 'じゅん 501', sans-serif;
  text-align: center;
  line-height: 1.2rem;
}nav li a span.sub_t {
  font-size: 0.8rem;
}nav li a img {
  width: 100px;
  height: 100px;
  margin-bottom: 0.3rem;
}/* メインエリア */
/* #endregion */
/* #region メインエリア / Main */
    .main {
  margin-left: 240px;
}
.hero {
  position: relative;
  height: 800px;
  max-height: 100vh;
  background: url('../../images/keyvisual_2.jpg') center/cover no-repeat;
  display: flex;
  align-items: right;
  justify-content: center;
  flex-direction: column;
  color: #515151;
  text-shadow: 1px 1px 3px rgba(255,255,255,0.6);
  text-align: right;
  /* padding-right: 30px;
  右端の余白調整 */;
/* DUPLICATE 1/2: first definition of '}.hero h1' */
}
.hero h1 {
  font-size: 1.8rem;
  margin: 0.5rem;
  position: relative;
  top: 20%;
  font-family: "丸フォーク M";
  background-color: rgba(0, 0, 0, 0.3);
  /* 黒 + 半透明 */
  color: white;
  padding: .5rem 1rem 1rem 1rem;
  display: inline-block;
}
.hero h1 strong {
  border-right: 5px solid #f1a950;
  font-style: normal;
  font-size: inherit !important;     /* ← これを追加 */
  line-height: inherit;   /* 文字の上下位置ズレ防止に推奨 */
  font-family: inherit;   /* ← 親h1の「丸フォーク M」を継承 */
  font-weight: inherit;
}
.hero p {
  font-size: 1.1rem;
  margin: 0;
}
/* Information セクション用 */
/* #endregion */
/* #region Information セクション */
.information {
  padding: 3rem 2rem;
  background-color: #fef7ef;
  border-top: 4px solid #f1a950;
  margin-bottom: 1rem;
}
.info-container {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 2rem;
}
.info-text {
  flex: 1 1 60%;
}
.info-text h2 {
  font-size: 1.4rem;
  color: #333;
  margin-bottom: 1rem;
  border-left: 6px solid #f1a950;
  padding-left: 0.5rem;
}
.info-text ul {
  list-style: none;
  padding: 0;
  margin: 0;
}
.info-text ul li {
  margin-bottom: 0.8rem;
  font-size: 1.2rem;
  padding-left: 0.5rem;
  position: relative;
}
.info-text ul li span {
  color: #555;
  margin-right: 0.5rem;
  display: inline-block;
  min-width: 100px;
}
.info-image {
  flex: 1 1 35%;
  text-align: center;
}
.info-image img {
  max-width: 100%;
  height: auto;
  border-radius: 8px;
  box-shadow: 0 2px 6px rgba(0,0,0,0.1);
}

/* スマホ表示時: Informationの日付を改行 */
@media (max-width: 768px) {
  .info-text ul li span {
    display: block;   /* インライン → ブロック化で改行 */
    margin-right: 0;  /* 右余白は不要になるのでリセット */
    margin-bottom: 0.2rem; /* 日付と本文の間に少し余白 */
  }
}

/* PC幅だけ適用（例：841px以上） */
@media (min-width: 841px) {
  .information time::after {
    content: "：";
    margin-right: 0.3em; /* 適度な空白 */
  }
}



.dementia {
  /*padding: 3rem 2rem;
  */
  padding: 1rem 2rem;
  background-color: #fff;
}
.dementia h2 {
  font-size: 1.4rem;
  color: #333;
  padding-left: 0.5rem;
  margin-bottom: 0.5rem;
}
.dementia .youtube-channel {
  text-align: center;
}
.section-description {
  margin-bottom: 2rem;
  color: #555;
  font-size: 1.2rem;
}
.section-description p {
  font-size: 1.2rem;
}
.section-description:after {
  background-color: #f1a950;
  /* 線色 */
    border-radius: 3px;
  /* 線幅の半分 */
    content: "";
  display: block;
  height: 6px;
  /* 線幅 */;
}
.featured-video {
  display: flex;
  gap: 2rem;
  flex-wrap: wrap;
  margin-bottom: 3rem;
}
.video-thumb img {
  max-width: 100%;
  border-radius: 8px;
  width: 560px;
  min-width: 560px;
}
.card-text {
  flex: 1;
}
.card-text .logo {
  height: 120px;
  display: block;
  margin: auto;
}
.card-text h3 {
  margin: 0.3rem 0;
}
.card-text p {
  margin: 0.5rem 0;
  color: #555;
}
.card-text .underline {
  width: 50px;
  height: 4px;
  background-color: #f1a950;
  margin-top: 1rem;
}
.character-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.5rem;
  margin: 0 auto 3rem auto;
  max-width: 100vw;
  /* 320px × 3列 + gap調整 */;
/* DUPLICATE 1/2: first definition of '}.card' */
}
.card {
  display: flex;
  background-color: #f6f6f6;
  border-radius: 12px;
  padding: 1rem;
  align-items: center;
  box-shadow: 0 2px 4px rgba(0,0,0,0.05);
/* DUPLICATE 1/2: first definition of '}.card img' */
}
.card img {
  width: 100px;
  border-radius: 50%;
  margin-bottom: 0.5rem;
  background-color: #fff;
}
.card h4 {
  margin: 0.2rem 0;
  font-size: 1.2rem;
  border-bottom: 1px solid #fcb645;
  color: #f1a950;
/* DUPLICATE 1/2: first definition of '}.card p' */
}
.card p {
  font-size: 1rem;
  color: #555;
}
.video-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 1.5rem;
  margin-bottom: 2rem;
}
.video-grid iframe {
  width: 100%;
  height: 160px;
  border-radius: 8px;
}
/* YouTube埋め込みをスマホ幅にフィット */
.video-thumb iframe {
  width: 100%;
  height: auto;
  aspect-ratio: 16 / 9;  /* iOS/Android/主要ブラウザ対応 */
  border: 0;
}
.more-button {
  text-align: center;
}
.more-button a {
  background-color: #f1a950;
  color: #fff;
  padding: 0.8rem 2rem;
  border-radius: 24px;
  text-decoration: none;
  font-weight: bold;
  transition: background-color 0.2s;
}
.more-button a:hover {
  background-color: #e19130;
}
.card-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 2rem;
  justify-content: space-between;
/* DUPLICATE 2/2: '}.card' — first at line 179 */
}
.card {
  flex: 1 1 calc(33% - 1.5rem);
  background-color: #fff;
  border-radius: 8px;
  box-shadow: 0 2px 8px rgba(0,0,0,0.1);
  overflow: hidden;
  transition: transform 0.2s ease;
}
.card:hover {
  /*transform: translateY(-4px);
  */;
/* DUPLICATE 2/2: '}.card img' — first at line 186 */
}
.card img {
  width: 100%;
  height: auto;
  display: block;
}
.card h3 {
  font-size: 1rem;
  margin: 0.8rem 1rem 0.3rem;
  color: #333;
/* DUPLICATE 2/2: '}.card p' — first at line 196 */
}
.card p {
  font-size: 1rem;
  color: #555;
}
/* DUPLICATE 1/6: first definition of '@media (max-width: 768px)' */
/* #endregion */
/* #region レスポンシブ: max-width 768px */
@media (max-width: 768px) {
.card {
  flex: 1 1 100%;
}
}
/* #endregion */
/* #region ふぁみコネについて / About */
.about-famicone {
  padding: 3rem 2rem;
  background-color: #fff;
}
.about-container {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 2rem;
}
.about-text {
  flex: 1 1 55%;
  font-size: 1.2rem;
  color: #333;
  line-height: 1.8;
}
.about-text h2 {
  font-size: 2rem;
  color: #f1a950;
  font-family: 'Hiragino Mincho ProN', serif;
  margin-bottom: 1rem;
}
.about-text .underline {
  width: 50px;
  height: 4px;
  background-color: #f1a950;
  margin-top: 1.5rem;
}
.about-text ul {
  list-style: none;
}
/* スマホ表示時: 左の余白を詰める */
@media (max-width: 768px) {
  .about-text ul {
    padding-left: 0;
  }
}


.about-text i {
  font-size: 1.5em;
  vertical-align: middle;
}i.fa-youtube {
  color:red;
}i.fa-line {
  color:limegreen;
}.about-image {
  flex: 1 1 20%;
  text-align: center;
}.about-image img {
  max-width: 100%;
  height: auto;
  border-radius: 8px;
  box-shadow: 0 2px 6px rgba(0,0,0,0.1);
}.friend {
  /* padding: 3rem 2rem;
  */
  padding: 1rem 2rem;
  background-color: #fff;
}.friend h2 {
  font-size: 1.4rem;
  color: #333;
  /*  border-left: 6px solid #f1a950;
  */
  padding-left: 0.5rem;
  margin-bottom: 0.5rem;
}.friend .section-description {
  margin-bottom: 2rem;
  color: #555;
  font-size: 1.2rem;
}.friend-container {
  display: flex;
  flex-wrap: wrap;
  gap: 2rem;
  align-items: center;
  justify-content: space-between;
}.friend-left {
  flex: 1 1 45%;
  display: flex;
  flex-direction: column;
  align-items: center;
}.friend-left p {
  text-align: center;
/* DUPLICATE 1/2: first definition of '}.line-qr-row' */
}.line-qr-row {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1.5rem;
  margin-bottom: 1rem;
/* DUPLICATE 1/2: first definition of '}.line-logo' */
}.line-logo {
  width: 60px;
/* DUPLICATE 1/2: first definition of '}.qr' */
}.qr {
  width: 160px;
}.line-text h3 {
  font-size: 1.1rem;
  color: #333;
  margin-bottom: 0.3rem;
}.line-text p {
  font-size: 0.9rem;
  color: #555;
/* DUPLICATE 1/2: first definition of '}.friend-right' */
}.friend-right {
  flex: 1 1 45%;
  text-align: center;
/* DUPLICATE 1/2: first definition of '}.friend-right img' */
}.friend-right img {
  max-width: 100%;
  height: auto;
  border-radius: 12px;
  box-shadow: 0 2px 6px rgba(0,0,0,0.1);
}
/* レスポンシブ対応 */
/* DUPLICATE 2/6: '@media (max-width: 768px)' — first at line 247 */
@media (max-width: 768px) {.friend-container {
  flex-direction: column;
/* DUPLICATE 2/2: '}.line-qr-row' — first at line 320 */
}.line-qr-row {
  flex-direction: column;
}}
.line-qr-row {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1.5rem;
  margin-bottom: 1rem;
/* DUPLICATE 2/2: '}.line-logo' — first at line 326 */
}.line-logo {
  width: 60px;
/* DUPLICATE 2/2: '}.qr' — first at line 328 */
}.qr {
  width: 160px;
}
@media (max-width: 600px) {.line-qr-row {
  flex-direction: column;
}}
/* #endregion */
/* #region COLUMN（読み物） */
.column {
  /*padding: 3rem 2rem;
  */
  padding: 1rem 2rem;
  background-color: #fefefe;
}
.column h2 {
  font-size: 1.4rem;
  color: #333;
  /*border-left: 6px solid #f1a950;
  */
  padding-left: 0.5rem;
  margin-bottom: 0.5rem;
}
.column .section-description {
  font-size: 1.2rem;
  color: #555;
  margin-bottom: 2rem;
  line-height: 1.8;
}/*
/* DUPLICATE 1/3: first definition of '.column-subtitle' */
.column-subtitle {
  font-size: 1.1rem;
  margin-bottom: 1rem;
  color: #333;
}*/
.column-content {
  position: relative;
}
.column-content img {
  float: right;
  width: 240px;
  margin-left: 1rem;
  margin-bottom: 1rem;
  border-radius: 8px;
  box-shadow: 0 2px 4px rgba(0,0,0,0.1);
/* DUPLICATE 1/3: first definition of '}.column-content p' */
}
.column-content p {
  font-size: 1.2rem;
  color: #444;
  line-height: 1.8;
  text-align: justify;
  overflow: hidden;
  /* float回り込み対策 */;
}
.column-content ul.medicine li {
  list-style: none;
}
.medicine i {
  color: #fcb645;
}
.medicine_info {
  /*color: #fcb645;
  */
  color: #f1a950;
  font-size: 1rem;
}
#column em {
  font-style: normal;
  background: linear-gradient(transparent 70%, #fff59d 70%);
}
#column sup {
  font-size: .8rem !important;
  position: relative;
  top: -3px;
}

#column h5 {
  display: inline-block;
  position: relative;
  background: #eee;
  padding: 2px .8em 2px 1.6em;
  font-size: 20px;
  color: #474747;
  border-radius: 0 10px 10px 0;
  margin: 0 .5em 0 1em;
}

#column h5:before {
  font-family: "Font Awesome 5 Free";
  content: "\f0eb";
  display: inline-block;
  line-height: 40px;
  position: absolute;
  padding: 0em;
  color: white;
  background: #ffa337;
  font-weight: 900;
  width: 40px;
  text-align: center;
  height: 40px;
  left: -1em;
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  border: solid 3px white; 
  border-radius: 50%;
}

p.point {
  position: relative;
  color: black;
  background: #d0ecff;
  line-height: 1.4;
  padding: 0.25em 0.5em;
  margin: 2em 0 0.5em;
  border-radius: 0 5px 5px 5px;
}

p.point:after {
  /*タブ*/
  position: absolute;
  font-family: "Font Awesome 5 Free",'Quicksand','Avenir','Arial',sans-serif;
  font-weight: 900;
  content: '\f0eb 注意点';
  background: #2196F3;
  color: #fff;
  left: 0px;
  bottom: 100%;
  border-radius: 5px 5px 0 0;
  padding: 3px 7px 1px;
  font-size: 0.7em;
  line-height: 1;
  letter-spacing: 0.05em
}

/* スマホ表示時: 全セクションの左右余白を詰める */
@media (max-width: 768px) {
  ul.medicine {
    padding-left: 0 !important;
    margin: 1rem .5rem !important;
  }
}


/* DUPLICATE 3/6: '@media (max-width: 768px)' — first at line 247 */
@media (max-width: 768px) {.column-content img {
  float: none;
  display: block;
  margin: 0 auto 1rem;
  width: 100%;
  max-width: 320px;
/* DUPLICATE 2/3: '}.column-content p' — first at line 399 */
}.column-content p {
  text-align: left;
}}
/* #endregion */
/* #region 会社情報 / Company */
.company {
  padding: 3rem 2rem;
  background-color: #fff;
}.company h2 {
  font-size: 1.4rem;
  color: #333;
  margin-bottom: 0.5rem;
}.company .section-description {
  font-size: 1.2rem;
  color: #555;
  margin-bottom: 2rem;
}.company-main {
  display: flex;
  flex-wrap: wrap;
  gap: 2rem;
  align-items: flex-start;
  margin-bottom: 2rem;
}.company-image {
  flex: 1 1 45%;
  max-width: 100%;
  height: auto;
  border-radius: 8px;
  box-shadow: 0 2px 6px rgba(0,0,0,0.1);
}.company-message {
  flex: 1 1 50%;
}.company-message h3 {
  font-size: 1.1rem;
  margin-bottom: 0.8rem;
}.company-message p {
  font-size: 0.9rem;
  color: #444;
  line-height: 1.8;
}.divider-line {
  width: 50px;
  height: 4px;
  background-color: #f1a950;
  margin: 2rem 0;
}.partners h4 {
  font-size: 1rem;
  margin-bottom: 0.5rem;
}.partners p a {
  color: #333;
  text-decoration: none;
  margin: 0 0.3rem;
}/*
/* DUPLICATE 1/2: first definition of '.contact' */
/* #endregion */
/* #region お問い合わせ / Contact */
.contact {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: 3rem;
  flex-wrap: wrap;
  gap: 1rem;
/* DUPLICATE 1/2: first definition of '}.contact img' */
}.contact img {
  max-width: 100px;
  height: auto;
/* DUPLICATE 1/2: first definition of '}.contact p' */
}.contact p {
  flex: 1 1 60%;
  text-align: center;
  font-size: 1.1rem;
  color: #333;
  margin: 0;
}.contact p strong {
  font-weight: bold;
  display: block;
  margin-top: 0.2rem;
}*/
/* DUPLICATE 2/2: '.contact' — first at line 470 */
.contact {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  /* 画像とテキストの間隔を小さくする */
  margin-top: 3rem;
/* DUPLICATE 2/2: '}.contact img' — first at line 477 */
}.contact img {
  max-height: 100px;
  /* 必要に応じて高さ調整 */
  margin: 0;
  /* 余計な余白を削除 */;
/* DUPLICATE 2/2: '}.contact p' — first at line 480 */
}.contact p {
  flex: 0 1 auto;
  /* 幅をテキストの長さに合わせる */
  text-align: center;
  font-size: 1.1rem;
  color: #333;
  margin: 0;
}
/* DUPLICATE 4/6: '@media (max-width: 768px)' — first at line 247 */
@media (max-width: 768px) {.company-main {
  flex-direction: column;
}.contact {
  flex-direction: column;
  text-align: center;
}}
/* #endregion */
/* #region フッター */
.footer {
  background-color: #f1a950;
  padding: 2rem 1rem;
  text-align: center;
  font-size: 1rem;
  color: #333;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  margin-left: 240px;
}.footer p {
  margin: 0;
}.footer a {
  color: #333;
  text-decoration: none;
  font-weight: normal;
}.footer-icons {
  margin-top: 1rem;
  display: flex;
  gap: 1rem;
  justify-content: center;
}.footer-icons img {
  width: 40px;
  height: 40px;
}.back-to-top {
  position: fixed;
  bottom: 20px;
  right: 20px;
  width: 60px;
  height: 60px;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.4s ease;
  z-index: 999;
}.back-to-top.visible {
  opacity: 1;
  pointer-events: auto;
}.back-to-top img {
  width: 100%;
  height: auto;
}/* 認知症のお薬について - COLUMN セクション追加デザイン */

/* DUPLICATE 2/3: '.column-subtitle' — first at line 384 */
.column-subtitle {
  font-size: 1.2rem;
  font-weight: bold;
  color: #333;
  margin-top: 2rem;
  margin-bottom: 1rem;
  border-left: 4px solid #f1a950;
  padding-left: 0.5rem;
}.column-content {
  margin-bottom: 2rem;
  font-size: 1.2rem;
  line-height: 1.8;
  color: #444;
  text-align: justify;
}.column-content ul {
  padding-left: 1.2rem;
  margin-bottom: 1rem;
}.column-content li {
  margin-bottom: 0.5rem;
  list-style: disc;
/* DUPLICATE 3/3: '}.column-content p' — first at line 399 */
}.column-content p {
  margin-bottom: 1.2rem;
}
/* DUPLICATE 5/6: '@media (max-width: 768px)' — first at line 247 */
@media (max-width: 768px) {.column-content {
  font-size: 1rem;
  text-align: left;
}}
/* #endregion */
/* #region もっと見るボタン */
.more-button {
  text-align: center;
  margin-top: 1rem;
}.more-button button {
  background-color: #f1a950;
  color: #fff;
  padding: 0.6rem 1.5rem;
  border: none;
  border-radius: 20px;
  font-size: 1rem;
  cursor: pointer;
  transition: background-color 0.2s;
}.more-button button:hover {
  background-color: #e19130;
}/* 初期状態（非表示・アニメーション可能） */
#medicine-more {
  max-height: 0;
  opacity: 0;
  overflow: hidden;
  transition: max-height 2.0s ease, opacity 2.0s ease;
}/* 表示状態（展開） */
#medicine-more.expanded {
  /* max-height: 3000px;
  必要に応じて大きく */
  opacity: 1;
}.dialogue-block {
  margin-top: 3rem;
  text-align: center;
}.dialogue-left,
/* DUPLICATE 1/2: first definition of '.dialogue-right' */
.dialogue-right {
  display: flex;
  align-items: flex-start;
  justify-content: center;
  gap: 1rem;
  margin-bottom: 1.5rem;
}
.dialogue-icon {
  width: 100px !important;
  height: auto;
  border-radius: 50% !important;
  box-shadow: 0 5px 12px rgba(0, 0, 0, 0.15) !important;
/* DUPLICATE 1/2: first definition of '}.speech-bubble' */
}.speech-bubble {
  max-width: 600px;
  padding: 1rem 1.2rem;
  border: 3px solid #eee;
  border-radius: 24px;
  background-color: #eee;
  font-size: 1.2rem;
  color: #333;
  line-height: 1.6;
  position: relative;
  text-align: left;
  margin: 0 0.5rem;
}.speech-bubble.left::before {
  content: "";
  position: absolute;
  top: 50%;
  left: -25px;
  transform: translateY(-50%);
  border: 10px solid transparent;
  border-right: 15px solid #eee;
}.speech-bubble.right::before {
  content: "";
  position: absolute;
  top: 50%;
  right: -25px;
  transform: translateY(-50%);
  border: 10px solid transparent;
  border-left: 15px solid #eee;
}.dialogue-caption {
  font-size: 1.2rem;
  color: #333;
  line-height: 1.8;
  margin-top: 2rem;
}
.operation-container {
  background-color: #fef1df;
  padding: 2rem;
  border-radius: 8px;
  display: flex;
  flex-direction: column;
  gap: 2rem;
}
.operation-info h2 {
  font-size: 1.2rem;
  color: #333;
  margin-bottom: 1rem;
}.operation-info p,
.operation-info ul {
  font-size: 1.2rem;
  color: #333;
  line-height: 1.7;
}.operation-info ul {
  list-style: none;
  padding-left: 0;
}.operation-info ul li {
  margin-bottom: 0.4rem;
}.operation-message-wrapper {
  display: flex;
  flex-wrap: wrap;
  gap: 2rem;
}.operation-aside {
  flex: 1 1 280px;
  text-align: center;
}.operation-photo {
  width: 100%;
  max-width: 280px;
  border-radius: 6px;
  box-shadow: 0 2px 6px rgba(0,0,0,0.1);
  margin-bottom: 1rem;
}.operation-partner {
  margin-top: 1rem;
}.operation-partner span {
  background-color: yellow;
  font-weight: bold;
  padding: 0 0.3rem;
}.operation-partner img {
  width: 170px;
  margin-top: 0.5rem;
  margin-top: 0.5rem;
  border-radius: 20px;
}/*
/* DUPLICATE 1/3: first definition of '.operation-message-box' */
.operation-message-box {
  flex: 1 1 500px;
  background-color: #fff9ef;
  padding: 1.5rem;
  border-left: 4px solid #f1a950;
  border-radius: 4px;
}*/
/* DUPLICATE 2/3: '.operation-message-box' — first at line 706 */
.operation-message-box {
  flex: 1 1 500px;
  background-color: #fff9ef;
  padding: 1.5rem;
  border-left: 4px solid #f1a950;
  border-radius: 4px;
}.operation-message-box h3 {
  font-size: 1.2rem;
  color: #333;
  margin-bottom: 1rem;
}.operation-message-box p {
  font-size: 1.2rem;
  color: #333;
}
/* レスポンシブ */
/* DUPLICATE 6/6: '@media (max-width: 768px)' — first at line 247 */
@media (max-width: 768px) {.operation-message-wrapper {
  flex-direction: column;
  align-items: center;
}.operation-aside,
/* DUPLICATE 3/3: '.operation-message-box' — first at line 706 */
  .operation-message-box {
  flex: 1 1 100%;
}}
/* トップに戻るタブ風ボタン */
/* #endregion */
/* #region トップに戻る（タブ風ボタン） */
.top-button {
  position: fixed;
  bottom: 60px;
  right: 0;
  width: 60px;
  height: 80px;
  background-color: #fcb645;
  color: white;
  font-family: inherit;
  font-size: 0.75rem;
  border: none;
  border-radius: 10px 0 0 10px;
  box-shadow: 0 2px 6px rgba(0,0,0,0.2);
  text-align: center;
  cursor: pointer;
  z-index: 999;
  display: none;
  line-height: 1.2;
  /*padding-top: 6px;
  */

  /* 追加：bottomのアニメーション */
  transition: bottom 1s ease;
}.top-button .arrow {
  font-size: 1.2rem;
  line-height: 1;
  display: block;
}.top-button .top-label {
  font-weight: bold;
  font-size: 0.9rem;
}.top-button .top-sub {
  font-size: 0.7rem;
}.tab-top-button:hover {
  right: 0;
  background-color: #e09130;
}.top-button.footer-overlap {
  bottom: 220px !important;
  /* フッターと重ならない位置 */;
}h2.menu-title {
  font-family: 'じゅん 501', sans-serif;
  font-size: 2rem;
  padding-left: 0;
}.dementia, .friend, .column {
  position: relative;
  background-color: #fff;
  overflow: hidden;
  z-index: 0;
  /* 背面に配置 */;
}
.accent-bg {
  position: absolute;
  top: 0;
  right: 0;
  z-index: -1;
  /* 背面に配置 */
  pointer-events: none;
}
.accent-text {
  font-size: 4rem;
  font-weight: bold;
  /*color: #ffeacc;*/
  color: #febe69;
  /* 白文字 */
/*
text-shadow:
  -1px -1px 0 rgba(255, 204, 0, 0.6),
   1px -1px 0 rgba(255, 204, 0, 0.6),
  -1px  1px 0 rgba(255, 204, 0, 0.6),
   1px  1px 0 rgba(255, 204, 0, 0.6);
  opacity: 0.8;
  */
  user-select: none;
  white-space: nowrap;
  margin: 0.5em 1em 0 0;
  font-family: 'じゅん 501', sans-serif;
}/* --- Fix: character card background and image centering --- */

.character-grid .card {
  background-color: #eee;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: flex-start;
  padding: 1rem;
  border-radius: 12px;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
  min-height: 200px;
}
.character-grid .card-img {
  width: 130px;
  height: auto;
  margin-right: 1rem;
  margin-bottom: 0;
  align-self: center;
}.character-grid .card-text {
  margin-top: 0;
}
/* Character grid auto-fit override: 3→2→1 を自動可変 */
/* #endregion */
/* #region キャラクターカード（グリッド） */
.character-grid {
  grid-template-columns: repeat(auto-fit, minmax(360px, 1fr));
}
/* キャラクターカード：最大3列に固定（PC）→ 2列 → 1列 */
.character-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
}
/* 幅が狭くなったら2列 */
@media (max-width: 1200px) {
  .character-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

/* スマホは1列 */
@media (max-width: 600px) {
  .character-grid {
    grid-template-columns: 1fr !important;
  }
}
/*
h3.column-subtitle {
  padding: 1rem 2rem;
  border-bottom: 3px dotted #f1a950;
  background: #f4f4f4;
  border-left: none;
}*/
.column h4 {
  position: relative;
  margin-bottom: 2em;
  padding: 1.5rem 2rem;
  border-radius: 10px;
  background: #eee;
  display: inline-block;
}.column h4:before,
.column h4:after {
  position: absolute;
  content: '';
  border-radius: 50%;
  background: #eee;
}.column h4:before {
  bottom: -15px;
  left: 30px;
  width: 30px;
  height: 30px;
}.column h4:after {
  bottom: -30px;
  left: 50px;
  width: 15px;
  height: 15px;
/* #endregion */
}/* #region ======= LINE 友だち登録カード ======= */
/* DUPLICATE 1/2: first definition of '.friend .friend-container' */
.friend .friend-container {
  display: grid;
  grid-template-columns: 2fr 1fr;
  gap: clamp(16px, 3vw, 32px);
  align-items: stretch;
}.friend-left, .friend-right {
  width: 100%;
}/* カード全体（緑枠・角丸） */
.line-card {
  --line-green: #06c755;
  /* 公式LINEグリーンに近い色 */
  --line-green-weak: #daf7e6;
  /* 薄い背景色 */
  background: #fff;
  border: 4px solid var(--line-green);
  border-radius: 20px;
  padding: clamp(16px, 3vw, 28px);
  box-shadow: 0 6px 10px rgba(0,0,0,.3);
/* DUPLICATE 1/2: first definition of '}.line-card__inner' */
}.line-card__inner {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: clamp(16px, 2.5vw, 28px);
  align-items: center;
}/* QR側 */
.line-card__qr {
  display: grid;
  place-items: center;
  background: #fff;
  border: 2px solid var(--line-green);
  border-radius: 16px;
  padding: clamp(8px, 1.5vw, 12px);
  width: clamp(160px, 24vw, 220px);
  aspect-ratio: 1 / 1;
}.line-card__qr img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}
/* 手順側 */
.line-card__steps ol {
  margin: 0;
  padding-left: 1.2em;
  line-height: 1.8;
  font-size: clamp(.9rem, 1.1rem, 1.2rem);
}.line-card__steps li + li {
  margin-top: .2em;
}.line-card__steps code {
  background: var(--line-green-weak);
  border-radius: 6px;
  padding: .1em .4em;
}/* CTAボタン */
.btn-line {
  display: inline-block;
  padding: .5em 1.6em;
  border-radius: 999px;
  background: var(--line-green);
  color: #fff;
  font-weight: 700;
  text-decoration: none;
  box-shadow: 0 3px 0 rgba(0,0,0,.08);
  transition: transform .05s ease, box-shadow .2s ease, filter .2s ease;
}.btn-line:hover {
  filter: brightness(1.05);
}.btn-line:active {
  transform: translateY(1px);
  box-shadow: 0 2px 0 rgba(0,0,0,.08);
}/* 右側のモック画像は角丸で柔らかく */
.friend-right img {
  width: 100%;
  height: 100%;
  border-radius: 16px;
  object-fit: cover;
  box-shadow: 0 6px 10px rgba(0,0,0,.3);
}
/* スマホ表示 */
/* #endregion */
/* #region レスポンシブ: max-width 820px */
@media (max-width: 820px) {.friend .friend-container {
  grid-template-columns: 1fr;
/* DUPLICATE 2/2: '}.line-card__inner' — first at line 880 */
}.line-card__inner {
  grid-template-columns: 1fr;
}.line-card__qr {
  margin: 0 auto;
/* DUPLICATE 2/2: '}.friend-right' — first at line 337 */
}.friend-right {
  order: -1;
}/* 画像→カード の順にしたければ削除 */

  /* 高さ揃え解除（1カラム時） */
/* DUPLICATE 2/2: '.friend .friend-container' — first at line 862 */
  .friend .friend-container {
  align-items: center;
/* DUPLICATE 2/2: '}.friend-right img' — first at line 340 */
}.friend-right img {
  height: auto;
  object-fit: contain;
}}
section:not(:first-of-type) {
  margin-bottom: 50px;
}section {
  opacity: 1;
  /* 1つ目はそのまま表示 */
  transform: translateY(0);
  transition: opacity 0.8s ease, transform 0.8s ease;
  /* 各セクションがアンカーリンクで飛んだときの位置補正 */
  scroll-margin-top: 80px;
  /* ヘッダーや固定ナビの高さに合わせる */;
}section.fade-in {
  opacity: 0;
  transform: translateY(30px);
}section.fade-in.show {
  opacity: 1;
  transform: translateY(0);
}.note {
  padding:0 1em;
  background: linear-gradient(#fadac3 1px, transparent 1px) #fffbf2;
  background-size: auto 2em;
  line-height: 2em;
  border-top: 1rem solid #fffbf2;
  border-bottom: 1px solid #fffbf2;
  border-left: .5rem solid #fffbf2;
  border-right: .5rem solid #fffbf2;
  overflow: hidden;
}.note h3, .note p {
  margin:0;
}.drug-table {
  border-collapse: collapse;
  table-layout: fixed;
  width: 95%;
  margin: auto;
  text-align: center;
/* DUPLICATE 1/2: first definition of '}.drug-table th, .drug-table td' */
}.drug-table th, .drug-table td {
  border: 2px solid #fcb645;
  padding: 1em;
}.drug-table thead th {
  background-color: #febe69;
  color: #fff;
  border: 2px solid #febe69;
  border-right: 2px solid #fff;
  border-bottom: 2px solid #fff;
}.drug-table thead th:last-of-type {
  border-right: 2px solid #febe69;
/* DUPLICATE 1/2: first definition of '}.drug-table tbody th' */
}.drug-table tbody th {
  color: #febe69;
  font-weight: bold;
  text-align: center;
}
/* #endregion */
/* #region レスポンシブ: screen and (max-width: 787px) */
@media screen and (max-width: 787px) {.drug-table {
  text-align: left;
}.drug-table thead {
  display:none;
/* DUPLICATE 2/2: '}.drug-table th, .drug-table td' — first at line 988 */
}.drug-table th, .drug-table td {
  display: block;
  border: 0;
  border-bottom: 1px solid #febe69;
/* DUPLICATE 2/2: '}.drug-table tbody th' — first at line 999 */
}.drug-table tbody th {
  background: #febe69;
  color:#fff;
}.drug-table td::before {
  content: attr(data-label);
  color: #f1a950;
  font-weight: bold;
  display: block;
  width: 100%;
  min-width: 4em;
}
}
/* --- Mobile: YouTubeサムネ画像のはみ出し防止 --- */
/* DUPLICATE 1/5: first definition of '@media (max-width: 840px)' */
/* #endregion */
/* #region レスポンシブ: max-width 840px */
@media (max-width: 840px) {.video-thumb,
  .video-thumb img {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  /* ← これで 560px の下限を解除 */
    height: auto !important;
}.video-thumb {
  overflow: hidden;
}
/* 角丸や枠のはみ出しも抑止 */
}
/* --- Mobile: 吹き出し横のアイコンを上下中央揃え --- */
/* DUPLICATE 2/5: '@media (max-width: 840px)' — first at line 1025 */
@media (max-width: 840px) {/* 吹き出しの左右コンテナを横並び＋中央揃えに */
  .dialogue-left,
/* DUPLICATE 2/2: '.dialogue-right' — first at line 616 */
  .dialogue-right {
  display: flex;
  align-items: center;
  /* ← これで縦方向の中央揃え */
    gap: 12px;
  /* 画像と吹き出しの間隔（お好みで） */;
}/* 画像は縮まず、吹き出し側を可変に */
  .dialogue-icon {
  flex: 0 0 auto;
  /* 画像が押しつぶされないよう固定 */
    display: block;
/* DUPLICATE 2/2: '}.speech-bubble' — first at line 627 */
}.speech-bubble {
  flex: 1 1 auto;
  /* 吹き出し側が幅を調整 */
    margin: 0;
  /* 既存で左右マージンがあれば不要分を打消し */;
}}
/* DUPLICATE 3/3: '.column-subtitle' — first at line 384 */
.column-subtitle {
  display: flex;
  justify-content: start;
  align-items: center;
  position: relative;
  padding: .5em .7em;
  overflow: hidden;
  border: 2px solid #f1a950;
  border-radius: 5px;
  color: #444;
  background-color: #fff0dc;
}.column-subtitle:before {
  position: absolute;
  top: -50%;
  left: -35px;
  z-index: 1;
  transform: rotate(20deg);
  width: 100px;
  height: 200%;
  background-color: #f1a950;
  content: '';
}.column-subtitle span {
  margin-right: 1.5em;
  margin-left: .2em;
  color: #fff;
  font-size: 1.2em;
  z-index: 999;
}
/* ▼ ハンバーガーメニュー用：画像を左、テキストを右に */
/* DUPLICATE 3/5: '@media (max-width: 840px)' — first at line 1025 */
@media (max-width: 840px) {/* メニューリンクを横並び＋左寄せ */
  nav li a {
  display: flex;
  /* 既存でもflexですが、念のため指定 */
    flex-direction: row;
  /* ← 縦並びから横並びへ */
    align-items: center;
  justify-content: flex-start;
  gap: 12px;
  /* 画像と文字の間隔 */
    text-align: left;
  /* テキストは左揃え */
    padding: 12px 16px;
  /* 触りやすいタップ領域 */;
}/* アイコン画像は小さめに */
  nav li a img {
  width: 64px;
  /* 例：32px。お好みで 28–40px 程度に */
    height: 64px;
  margin: 0;
  /* 既存の margin-bottom を打消し */
    flex: 0 0 auto;
}/* 2行表記（大タイトル＋サブ）の行間を少し詰める */
  nav li a span {
  line-height: 1.2;
}nav li a .sub_t {
  font-size: 0.85rem;
  /* サブテキストは少し小さく */
    opacity: .85;
}}
/* モバイル表示時のみ表示させるタグ */
/* DUPLICATE 1/2: first definition of '.sp' */
.sp {
  display: none;
}
/* 画面が狭いときはヒーローのキャッチを縦書きに */
/* DUPLICATE 4/5: '@media (max-width: 840px)' — first at line 1025 */
@media (max-width: 840px) {
.hero {
  background: url('../../images/keyvisual_1.jpg') center/cover no-repeat;
  /* 右寄せで重ねやすく */
    align-items: flex-start;
  /* 全体の上寄せ */
    justify-content: flex-start;
  text-align: left;
/* DUPLICATE 2/2: '}.hero h1' — first at line 62 */
}
.hero h1 {
  writing-mode: vertical-rl;
  /* ← 縦書き */
    text-orientation: mixed;
  /* 数字/英字の可読性 */
    position: absolute;
  /* 画像の上に固定配置 */
    right: 20px;
  /* 右からの距離 */
    top: 20px;
  /* 上からの距離 */
    margin: 0;
  padding: .8rem;
  line-height: 1.8;
  font-size: 1.1rem;
  /* モバイル用に少し小さめ */
    background-color: rgba(0,0,0,.2);
  /* 既存の半透明背景を踏襲 */
    color: #fff;
}/* 縦書きでは <br> を無効化して詰める */
  /*.hero h1 br {
  display: none;
}*/

/* モバイル表示時のみ表示させるタグ */
/* DUPLICATE 2/2: '.sp' — first at line 1117 */
.sp {
  display: block;
}/* 強調の下線は縦書きでは右ボーダーに変更 */
  .hero h1 em {
    border-bottom: 0;
    border-right: 4px solid #f1a950;
    padding-right: .2em;
    margin-right: -.2em;     /* ← 追加：押し出しを打ち消す */
    font-style: normal;
    font-size: inherit !important;     /* ← これを追加 */
    line-height: inherit;   /* 文字の上下位置ズレ防止に推奨 */
    font-family: inherit;  /* ← これを追加 */
    font-weight: inherit;
  }
}
/* #endregion */
/* #region about画像をスマホ時はテキストの背景にする */
/* DUPLICATE 5/5: '@media (max-width: 840px)' — first at line 1025 */
@media (max-width: 840px) {.about-container {
  position: relative;
}/* 右側の画像は非表示に */
  .about-image {
  display: none;
}/* テキストを1カラムにして背景画像を適用 */
  .about-text {
  /* ← 1枚目（上）：半透明の白。2枚目（下）：写真 */
    background:
      linear-gradient(rgba(255,255,255,.80), rgba(255,255,255,.80)),
      url("../../images/25801160_s.jpg");
  background-position: right center;
  background-size: cover;
  background-repeat: no-repeat;
  border-radius: 8px;
  padding: 1rem;
}
}
/* #endregion */

/* #region お問い合わせ / Contact — tuning v2.1
   目的:
   - 左右の画像とテキストの間隔を詰める
   - 左右のキャラクター画像の高さを揃える（アスペクト比維持）
   備考: 既存の .contact ルールの「後勝ち」になるよう、末尾に追記しています。
*/
.contact {
  gap: 16px;              /* 画像とテキストの間隔 */
  justify-content: center; /* 念のため明示（既存と同じ） */
}

.contact img {
  height: 80px;           /* 左右の画像の高さを揃える */
  width: auto;            /* アスペクト比維持 */
  max-height: none;       /* 既存のmax-height:100pxを上書き解除 */
}

.contact p {
  margin: 0;              /* 余白をゼロにして詰める */
  flex: 0 1 auto;         /* 既存方針を再確認（伸びすぎ防止） */
}

/* モバイル時は少し余裕を持たせる */
@media (max-width: 768px) {
  .contact { gap: 12px; }
}
/* #endregion */

/* スマホ表示時: 全セクションの左右余白を詰める */
@media (max-width: 768px) {
  section {
    padding: 3rem 1rem !important;  /* 上下: 3rem / 左右: 1rem */
  }
}
/* スマホ時: キャラクターカードの余白修正 */
@media (max-width: 768px) {
  .character-grid .card {
    flex: 1 1 100% !important;   /* 横幅を100%に */
    margin: 0 auto 1.5rem auto;  /* 左右を均等に中央寄せ */
  }
}
/* === Mobile heading scale: 控えめに差を残す ====================== */
@media (max-width: 768px) {
  /* 本文ベース：既存 1.1rem を明示し、行間を少しだけ詰める */
  body {
    font-size: 1.1rem;   /* ≈18px */
    line-height: 1.7;
  }

  /* 見出しの縮尺：本文の約1.3倍 & 1.15倍 に調整 */
  h2 {
    font-size: 1.4rem;   /* ≈22–23px */
    line-height: 1.35;
  }
  h3 {
    font-size: 1.25rem;  /* ≈20px */
    line-height: 1.35;
  }

  /* “セクション見出し”など個別指定を一括で上書き */
  /* 例：.about-text h2（2rem→縮小）、h2.menu-title（2rem→縮小）など:contentReference[oaicite:2]{index=2} */
  .about-text h2,
  h2.menu-title {
    font-size: 1.4rem;   /* セクション見出しを共通で */
    line-height: 1.35;
  }

  /* 小見出し群（必要に応じて） */
  .operation-message h3,
  .card-text h3,
  .column-subtitle {
    font-size: 1.25rem;
    line-height: 1.4;
  }

  /* ナビのテキストはタップしやすく */
  nav li a span { line-height: 1.4; } /* 既存1rem相当のまま行間だけ確保:contentReference[oaicite:3]{index=3} */
}
/* === Mobile: 「私たちの想い」ノート罫線と行間を完全同期 ================= */
@media (max-width: 768px) {
  .note {
    /* 端末差が出ない整数pxで“行送り(leading)”を決める */
    --note-leading: 30px;              /* 本文18pxに相性の良い目安。必要なら 28px/32px に微調整 */

    /* 行間と背景を同じ値に固定してドリフトを防ぐ */
    line-height: var(--note-leading);

    /* 罫線はrepeating-linear-gradientを content-box 起点で描く */
    background-image: repeating-linear-gradient(
      to bottom,
      #ead8c6 0,
      #ead8c6 1px,
      transparent 1px,
      transparent var(--note-leading)
    );
    background-origin: content-box;   /* ← ボーダーの厚みに影響されない */
    background-clip: content-box;
    background-position: left 0 top 0;/* 先頭行の上端から開始 */
    background-size: 100% var(--note-leading);
    background-color: #fffbf2;

    /* 上下は半行ぶんの余白で、文字が罫線の“中間”に来るように */
    padding: calc(var(--note-leading) / 2) 0;

    /* 既存の太いボーダーが起点をずらすのを防ぐ（見た目を保ちたい場合は不要） */
    /* border-top: 0; border-bottom: 0; */
  }

  /* ノート内の見出し・段落は行送りを継承＆余白ゼロでズレ要因を排除 */
  .note h3,
  .note p {
    margin: 0;
    line-height: inherit;
  }
}
/* --- operation section: ノート背景と余白調整 --- */
.operation-message-box.note {
  background-color: #fffbf2; /* 念のため明示 */
}
/* === NOTE: 罫線と背景のにじみ(上下のオレンジ露出)を解消 ================= */
@media (max-width: 768px) {
  .note {
    /* 行送りは整数pxで固定（罫線と完全同期） */
    --note-leading: 30px;

    line-height: var(--note-leading);

    /* グラデは「content-box」を起点にして行送りと同期させる */
    background-image: repeating-linear-gradient(
      to bottom,
      #ead8c6 0,
      #ead8c6 1px,
      transparent 1px,
      transparent var(--note-leading)
    );
    background-origin: content-box;

    /* ← ここを padding-box に変更して、パディング部にも背景色を塗る */
    background-clip: padding-box;

    background-color: #fffbf2;     /* ノートの地色 */
    background-size: 100% var(--note-leading);
    background-position: left 0 top 0;

    /* 半行パディング（上下の帯も #fffbf2 で塗られる） */
    /*padding: calc(var(--note-leading)/2) 1em;*/
    padding: calc(var(--note-leading)/2) 0;

    /* 既存の太い上下ボーダーが不要なら解除（任意）
       border-top: 0; border-bottom: 0; */
  }

  /* 見出し・段落は行送りを継承。余白がズレの原因にならないよう最小に */
  .note h3,
  .note p { margin: 0; line-height: inherit; }

  /* 外側の余白をもう少しだけ詰める（会社メッセージ枠） */
  .operation-message-box.note {
    margin: 0.5rem 0;   /* 以前よりさらに控えめに */
    padding: 1rem;      /* 内側もややコンパクトに */
    background-color: #fffbf2;  /* 念のため明示 */
  }
  .operation-container {
    padding: 2rem 1rem;
  }
}
/* --- operation: 2カラム化 & 折り返し最適化（mobile first） --- */
.operation-info ul { margin: 0; padding: 0; list-style: none; }
.operation-info ul li{
  display: grid;
  grid-template-columns: 6em 1fr; /* ラベル固定/値可変 */
  gap: 4px 12px;
  align-items: start;
  margin-bottom: .4rem;
}
.operation-info ul li .label{ white-space: nowrap; color:#555; }
.operation-info ul li .value{
  line-break: strict;        /* 日本語の禁則処理 */
  word-break: normal;        /* 不要な単語分割を防ぐ */
  overflow-wrap: anywhere;   /* 連続英数の保険 */
}

/* 公式サイトリンクは“ボタン化”して途中改行を防ぐ */
.operation-info a.operation-link{
  text-align:center;
  padding:0 12px;
  border:1px solid #f1a950;
  border-radius:10px;
  text-decoration:none;
  font-weight:700;
  white-space: nowrap;          /* 標準は折り返さない */
}
/* 幅が非常に狭い端末だけは安全に折返し可 */
@media (max-width: 360px){
  .operation-info a.operation-link{ white-space: normal; overflow-wrap:anywhere; }
}

/* きわめて狭い画面では1カラムにフォールバック */
@media (max-width: 340px){
  .operation-info ul li{ grid-template-columns: 1fr; }
  .operation-info ul li .label{ opacity:.85; }
}

/* プライバシーポリシーページ専用 h3 見出し */
.policy-subtitle {
  font-size: 1.3rem;
  font-weight: bold;
  color: #333;
  margin: 2rem 0 1rem;
  padding-left: 0.6em;
  border-left: 4px solid #f1a950; /* オレンジの縦ラインでアクセント */
  background: none;
  border-radius: 0;
}

.policy-subtitle span {
  margin-right: 0.2em;
  color: #f1a950; /* 番号だけオレンジ */
  font-size: 1.3rem;
}

/* === KV縦書き見出しと本文 ====================== */
.hero .kv-copy {
  writing-mode: vertical-rl;
  text-orientation: mixed;
  position: absolute;
  right: 0;
  top: 0;
  text-align: left;
  background: rgba(255,255,255,0.55);
  padding: 12px 28px 12px 12px;
  max-height: 100vh;
}

/* 見出し */
.hero .kv-headline {
  /* .hero h1 の既存ルールを打ち消し */
  position: static;
  top: auto;
  right: auto;
  background: none;
  color: #222;
  text-shadow: none;
  padding: 0;
  display: block;

  font-size: 2rem;     /* 大きめに強調 */
  line-height: 2;
  margin: 0 0 1.5rem 0;
  font-weight: bold;
}

/* 本文 */
.hero .kv-text {
  font-size: 1.2rem;
  line-height: 1.9;
  color: #333;
  margin: 2.5rem 0 1rem 1rem;
}

/* 強調 */
.hero .kv-text em {
  font-style: normal;
  background-color: #f1a950;
}

/* レスポンシブ調整 */
@media (max-width: 840px){
  .hero .kv-copy {
    right: 12px;
    top: 12px;
    padding: 12px 8px;
    margin-bottom: 12px;
  }
  .hero .kv-headline {
    font-size: 1.4rem;
    line-height: 1.6;
  }
  .hero .kv-text {
    font-size: 1rem;
    line-height: 1.7;
  }
}

/* === 運営（company）: PCで「テキスト｜写真」→ 下段にノート（全幅） === */
@media (min-width: 840px) {
  /* 2×2 グリッドを作り、下段はノートが全幅を占有 */
  .company-container {
    display: grid;
    grid-template-columns: 1fr 520px;      /* 左：本文 / 右：写真 */
    grid-template-areas:
      "info  aside"
      "note  note";
    gap: 2rem 2rem;
    align-items: start;
  }

  /* 既存のHTML構造に合わせて“配置だけ”指定 */
  .company-info { grid-area: info; }
  .company-message-wrapper { display: contents; } /* ← 子要素を直にグリッドへ */
  .company-aside { grid-area: aside; text-align: right; }
  .company-message-box { grid-area: note; }       /* 下段・全幅 */

  /* 写真とキャプションの体裁少しだけ調整 */
  .company-photo {
    max-width: 480px;
    width: 100%;
    display: block;
    margin: 0 0 1rem auto;   /* 右寄せ＋下余白 */
    border-radius: 8px;
  }
  .company-partner {
    text-align: left;
    margin-top: .75rem;
    line-height: 1.7;
  }
}
/* 運営：内側ボックスに旧デザインのオレンジ背景を付与 */
.company .company-container{
  background: #fef1df;
  border-radius: 8px;
  padding: 2rem;
}

/* PCでの配置はそのまま維持（上段：テキスト｜写真／下段：ノート） */
@media (min-width: 840px){
  .company-container{
    display: grid;
    grid-template-columns: 1fr 520px;
    grid-template-areas:
      "info  aside"
      "note  note";
    gap: 2rem 2rem;
    align-items: start;
  }
  .company-info{ grid-area: info; }
  .company-info h2 { margin-top: 0; }
  .company-message-wrapper{ display: contents; }
  .company-aside{ grid-area: aside; text-align: right; }
  .company-message-box{ grid-area: note; }
  .company-photo{ max-width: 520px; width:100%; margin:0 0 1rem auto; border-radius:8px; display:block; }
  .company-partner{ text-align:left; margin-top:.75rem; line-height:1.7; }
}

/* === Company（運営）レイアウト修正 === */
/* 上段：本文｜写真、下段：ノート（全幅） */
.company-container {
  display: grid;
  grid-template-columns: 1.4fr 1fr;  /* PCは本文をやや広め */
  grid-template-areas:
    "info  aside"
    "note  note";
  gap: 2rem;
  align-items: start;
  background-color: #fef1df; /* 既存のオレンジ背景 */
  padding: 2rem;
  border-radius: 8px;
}

.company-info { grid-area: info; }

.company-aside { grid-area: aside; text-align: right; }
.company-message-box { grid-area: note; }

/* 画像の調整 */
.company-photo {
  width: 100%;
  max-width: 520px;
  height: auto;
  border-radius: 8px;
  display: block;
  margin: 0 0 1rem auto;
}
.company-partner {
  text-align: left;
  margin-top: .75rem;
  line-height: 1.7;
}

/* 1200px以下：本文と写真を50:50に */
@media (max-width: 1200px) {
  .company-container {
    grid-template-columns: 1fr 1fr; /* 半々 */
  }
  .company-photo {
    max-width: 100%;
  }
}

/* 768px以下：縦積み */
@media (max-width: 768px) {
  .company-container {
    grid-template-columns: 1fr;
    grid-template-areas:
      "info"
      "aside"
      "note";
    padding: 1rem !important;
  }
  .company-aside { text-align: center; }
  .company-photo { margin-inline: auto; max-width: min(520px, 100%); }
}
/* 会社情報（運営）セクション：右カラムを上下中央揃え */
.company-aside {
  grid-area: aside;
  display: flex;               /* 中身をフレックス化 */
  flex-direction: column;      /* 縦に積む */
  justify-content: center;     /* 縦方向中央 */
  align-items: flex-end;       /* 横は右寄せ（PC幅） */
  text-align: right;
}
/* === 運営（company）1段目：左テキスト｜右写真、2段目ノート全幅 === */
@media (min-width: 840px) {
  .company-container{
    display: grid;
    grid-template-columns: 1fr 520px;     /* PCは本文広め */
    grid-template-areas:
      "info  aside"                       /* 1段目：左右 */
      "note  note";                       /* 2段目：ノート全幅 */
    gap: 2rem;
    align-items: start;                   /* 行の基準は上揃え */
  }
  .company-info p { margin-top: .5rem; }
  .company-info{ grid-area: info; }       /* 左：テキスト */
  .company-message-wrapper{ display: contents; } /* 子を直にグリッドへ */
  .company-aside{
    grid-area: aside;                     /* 右：写真ブロック */
    display: flex;                        /* ← 上下中央にするためflex化 */
    flex-direction: column;
    justify-content: center;              /* ★上下中央 */
    align-items: flex-end;                /* 右寄せ（PC） */
    text-align: right;
  }
  .company-message-box{ grid-area: note; }/* 下段ノート */

  .company-photo{
    width: 100%;
    max-width: 520px;                     /* 列内で縮小拡大 */
    height: auto;
    display: block;
    margin: 0 0 1rem auto;
    border-radius: 8px;
  }
  .company-partner{
    text-align: left;
    margin-top: .75rem; line-height: 1.7;
  }
}

/* 画面幅が狭くなったら左右 50:50（テキスト：画像） */
@media (max-width: 1200px){
  .company-container{ grid-template-columns: 1fr 1fr; } /* 半々 */
  .company-photo{ max-width: 100%; }                     /* 列幅いっぱい */
}

/* スマホは縦積み（既存の見え方を保持） */
@media (max-width: 768px){
  .company-container{
    grid-template-columns: 1fr;
    grid-template-areas:
      "info"
      "aside"
      "note";
  }
  .company-aside{ align-items: center; text-align: center; }
  .company-photo{ margin-inline: auto; max-width: min(520px, 100%); }
}

.partners-list {
  margin: 0;
  border-top: 1px dotted #444;
}
.partners-list dt {
  font-size: .9rem;
}
.partners-list dd {
  margin-left: 0;
  font-size: .9rem;
}



/* ===== Side nav: small-height & high-scaling safe ===== */
/* まずは“確実に読める”安全策（常時有効） */
nav {
  overflow-y: auto;               /* メニュー内だけ独立スクロール */
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
}

/* ── デスクトップ幅のみで段階縮小（スマホは mobile-nav.css が制御） ── */

/* 1段階：FHD×150% でも多くの環境で収まる目安（ロゴは維持） */
@media (min-width: 841px) and (max-height: 920px) {
  .nav-logo img { width: 150px; }            /* ← 既定の見栄えを優先 */
  nav li { margin-bottom: 1rem; }
  nav li a { font-size: 0.95rem; line-height: 1.2rem; }
  nav li a span.sub_t { font-size: 0.82rem; }
  nav li a img { width: 88px; height: 88px; }/* 100 → 88 */
}

/* 2段階：さらに縦が詰まる環境（ノートPC＋150% など） */
@media (min-width: 841px) and (max-height: 820px) {
  .nav-logo img { width: 140px; }            /* ほんの少しだけ縮小 */
  nav li { margin-bottom: 0.9rem; }
  nav li a { font-size: 0.90rem; line-height: 1.15rem; }
  nav li a span.sub_t { font-size: 0.80rem; }
  nav li a img { width: 76px; height: 76px; }/* 88 → 76 */
}

/* 3段階：厳しめの環境（小型モニタ＋150% など） */
@media (min-width: 841px) and (max-height: 740px) {
  .nav-logo img { width: 130px; }            /* 最小でもここまで */
  nav li { margin-bottom: 0.75rem; }
  nav li a { font-size: 0.875rem; line-height: 1.1rem; }
  nav li a span.sub_t { font-size: 0.78rem; }
  nav li a img { width: 64px; height: 64px; }/* 76 → 64 */
}

/* （任意）PCでドロップシャドウを消したい場合
nav { box-shadow: none !important; }
*/

/* === YouTube 埋め込み: デスクトップで小さくならないように調整 === */
.featured-video {
  align-items: stretch;                 /* 高さ合わせ（任意） */
}

.video-thumb {
  flex: 1 1 640px;                      /* 初期幅をしっかり確保 */
  min-width: 560px;                     /* デスクトップの下限幅 */
  width: 100%;                           /* 余裕があれば広がる */
}

/* モバイルでは下限幅を解除して横幅100%に */
@media (max-width: 840px) {
  .video-thumb { min-width: 0; }
}

/* すでに記載されている iframe のリキッド化はこのままでOK
.video-thumb iframe { width:100%; height:auto; aspect-ratio:16/9; border:0; } 
*/


/* YouTubeリンクを改行させない */
.youtube-channel a {
  display: inline-block;  /* 幅をテキスト分に */
  white-space: nowrap;    /* 折り返し禁止 */
  word-break: keep-all;   /* CJKでもできるだけ改行しない */
  overflow-wrap: normal;  /* 念のため */
}

/* 画面が極端に狭い時だけ少し縮めたい場合（任意） */
@media (max-width: 360px) {
  .youtube-channel a { font-size: 0.95rem; }
}


.new-mark {
  color: #fff !important;
  background-color: #e53935 !important;
  margin: 0 !important;
  font-size: 0.7em !important;
  min-width: auto !important;
  border-radius: 5px !important;
  padding: 0 7px !important;
}

.main a {
  color: #f4a200;              /* オレンジ */
  text-decoration: none;       /* 通常は下線なし */
  transition: color 0.2s ease;
}

.main a:hover {
  color: #d98200;              /* 濃いオレンジ */
  text-decoration: underline;  /* ホバー時のみ下線 */
}

.main a:visited {
  color: #c46f00;              /* 訪問済みは少し落ち着いた色 */
}

.footer a {
  color: #fff;                 /* 通常は白 */
  text-decoration: none;
font-size: .9em;
  /*transition: color 0.2s ease;*/
}

.footer a:hover {
  color: #fff;              /* ホバーでオレンジ */
  text-decoration: underline;
}

.footer a:visited {
  color: #fff;                 /* 訪問済みも白で統一 */
}

a.btn-line,
a.btn-line:hover,
a.btn-line:visited {
  color: #fff;
  text-decoration: none;
}

.footer-icons a img {
  transition: transform 0.2s ease, opacity 0.2s ease;
}

.footer-icons a:hover img {
  transform: scale(1.1);   /* 少し拡大 */
  opacity: 0.8;            /* 透明度を下げる */
}

.disclaimer {
  margin-top: 30px;
}
.disclaimer p {
  font-size: .7em;
  border-top: 1px dotted #622d18;
  padding-top: 1em;
  color: #622d18;
}

section#dementia .menu-youtube {
  line-height: 2rem !important;
  margin-top: .5rem;
  margin-bottom: 0;
}

.preload-font::before {
  content:"0123456789 / : 年月日時分秒";
  font-family:'UDDigiKyokasho R JIS2004', sans-serif;
  position:absolute;
  left:-9999px; top:-9999px;
  opacity:0;
  pointer-events:none;
}