@charset "UTF-8";
/* ============================================
   page-meniscus 専用CSS
   - 注目の症例報告（.sec-fcase）
   - 半月板損傷FAQ（.treatment-faq-body）
   ※ page-meniscus.php の末尾でのみ読み込む（他ページには適用しない）
   ============================================ */

/* --- 注目の症例報告 sec-fcase --- */
.sec-fcase { --fc-green:#009c6c; --fc-yellow:#f1dd59; --fc-brown:#a27d49; margin:60px 0; }
.sec-fcase .fcase-inner { max-width:960px; margin:0 auto; padding:0 4%; }
.sec-fcase .fcase-inner + .fcase-inner { margin-top:60px; }
.sec-fcase .gradient-box { border-radius:10px; background:linear-gradient(to bottom,#39ae75,#f9df58); padding:20px; }
.sec-fcase .gradient-box-inner { background:#fff; border-radius:10px; }
.sec-fcase .report-content { padding:60px 75px 40px; }
.sec-fcase .report-ttl { text-align:center; color:var(--fc-green); font-weight:bold; position:relative; }
.sec-fcase .report-ttl::before { content:""; width:46px; height:49px; background:url(/img/stroke/report-ttl.png) no-repeat center/100%; position:absolute; bottom:-15px; left:50%; transform:translateX(-180px); }
.sec-fcase .report-ttl span { font-size:2.6rem; line-height:1.5; display:inline; }
.sec-fcase .report-ttl .marker { background:linear-gradient(to bottom,transparent 70%,var(--fc-yellow) 50%); }
.sec-fcase .report-ttl b { font-size:4rem; display:block; margin-top:20px; position:relative; z-index:2; }
.sec-fcase .report-lead { font-size:1.8rem; font-weight:500; margin-top:40px; line-height:1.8; }
.sec-fcase .report-movie { margin-top:50px; text-align:center; }
.sec-fcase .report-movie iframe { width:520px; max-width:100%; aspect-ratio:16/9; }
.sec-fcase .report-movie p { margin-top:20px; text-align:left; font-size:1.4rem; color:#666; }
.sec-fcase .report-content section { margin-top:40px; }
.sec-fcase .report-content section + section { padding-top:40px; border-top:solid 1px #ddd; }
.sec-fcase .report-content section h3 { padding:0 10px; height:40px; display:flex; align-items:center; background:var(--fc-green); color:#fff; font-weight:bold; margin-bottom:15px; font-size:1.8rem; }
.sec-fcase .report-content section p { line-height:1.8; }
.sec-fcase .report-content section p + p { margin-top:25px; }
.sec-fcase .report-content strong { font-weight:bold; background:linear-gradient(to bottom,transparent 70%,var(--fc-yellow) 30%); }
.sec-fcase blockquote { margin:25px 0 0; padding:15px 20px; border-left:4px solid var(--fc-green); background:#eff8f5; font-weight:bold; line-height:1.8; }
.sec-fcase .fc-note { font-size:1.2rem; color:#888; margin-top:15px; }
.sec-fcase .report-content section table { margin-top:30px; width:100%; border-collapse:collapse; }
.sec-fcase .report-content section table th { background:#f9f4f1; text-align:left; padding:10px; font-weight:500; color:var(--fc-brown); width:9em; vertical-align:top; border:1px solid #e5e5e5; }
.sec-fcase .report-content section table td { padding:10px; border:1px solid #e5e5e5; }
.sec-fcase .dot-list li { padding-left:.5em; text-indent:-.5em; }
.sec-fcase .dot-list li::before { content:"・"; }
.sec-fcase .report-image { margin-top:50px; text-align:center; }
.sec-fcase .report-image img { max-width:100%; height:auto; border-radius:6px; }
.sec-fcase .report-image figcaption { font-size:1.3rem; color:#888; margin-top:10px; }
.sec-fcase .report-btn { margin-top:40px; display:flex; justify-content:center; gap:30px; flex-wrap:wrap; }
.sec-fcase .btn01 { background:var(--fc-brown) url(/img/stroke/arrow01.svg) no-repeat center right 20px/4px; display:inline-flex; justify-content:center; align-items:center; min-width:230px; height:60px; transition:background-color .3s ease; text-decoration:none; padding:0 40px 0 50px; }
.sec-fcase .btn01:hover { background-color:#474747; }
.sec-fcase .btn01 span { color:#fff; font-size:1.4rem; font-weight:bold; line-height:1.5; }
.sec-fcase .article-btn { position:relative; }
.sec-fcase .article-btn::before { position:absolute; top:0; bottom:0; left:18px; width:21px; height:22px; margin:auto; background:url(/img/stroke/ico-article.svg) no-repeat center/cover; content:""; }
@media screen and (max-width:767px) {
  .sec-fcase .report-content { padding:40px 20px; }
  .sec-fcase .report-ttl::before { width:44px; height:44px; transform:translateX(-140px); }
  .sec-fcase .report-ttl span { font-size:2rem; }
  .sec-fcase .report-ttl b { font-size:30px; }
  .sec-fcase .report-lead { font-size:16px; font-weight:normal; }
  .sec-fcase .report-movie { margin-top:30px; }
  .sec-fcase .report-btn { margin-top:20px; gap:15px; }
}

/* --- 治療詳細（表→テキスト化。スクロール縦幅を抑えるためテキストサイズを下げる） --- */
.sec-fcase .report-detail { margin-top:20px; }
.sec-fcase .report-detail p { font-size:1.4rem; line-height:1.8; margin:0; color:#333; }
.sec-fcase .report-detail p + p { margin-top:6px; }
.sec-fcase .report-detail .rd-label { font-weight:bold; color:var(--fc-green); }
@media screen and (max-width:767px) {
  .sec-fcase .report-detail p { font-size:1.3rem; }
}

/* --- 半月板損傷FAQ treatment-faq-body --- */
.treatment-faq-body .faq-list { max-width:900px; margin:0 auto; }
.treatment-faq-body .faq-item { background:#fff; border:1px solid #ddd; border-radius:8px; padding:24px 28px; margin:0 0 20px; }
.treatment-faq-body .faq-q { font-size:18px; font-weight:bold; margin:0 0 12px; color:#00694b; line-height:1.6; }
.treatment-faq-body .faq-q::before { content:"Q. "; }
.treatment-faq-body .faq-a { margin:0; line-height:2; }
.treatment-faq-body .faq-a::before { content:"A. "; font-weight:bold; color:#b3282d; }
@media (max-width:767px) {
  .treatment-faq-body .faq-item { padding:18px 16px; }
  .treatment-faq-body .faq-q { font-size:16px; }
}