/* ========================================
   相談支援LP専用スタイル（デザイン強化版）
   index-consultation-support.html 専用
======================================== */

/* ========================================
   カラー変数
======================================== */
:root {
    --primary-green: #A8D5BA;
    --accent-green: #8BC4AA;
    --dark-green: #6B9E7E;
    --light-green: #C4E5D3;
    --very-light-green: #E8F5ED;
    --soft-green: #D4EBE0;
    --text-dark: #2C3E36;
    --text-medium: #4A5F52;
    --text-light: #6B7F72;
    --bg-white: #FFFFFF;
    --bg-light: #F8FAF9;
    --font-sans: 'Noto Sans JP', sans-serif;
    --font-serif: 'Noto Serif JP', serif;
    --section-padding: 80px 0;
    --container-max: 1200px;
}

/* ========================================
   共通：セクション画像
======================================== */
.section-image {
    max-width: 600px;
    margin: 0 auto 50px;
    text-align: center;
}

.section-image img {
    width: 100%;
    height: auto;
    border-radius: 20px;
    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.08);
    transition: all 0.3s ease;
}

.section-image img:hover {
    transform: translateY(-5px);
    box-shadow: 0 12px 40px rgba(168, 213, 186, 0.2);
}

/* ========================================
   共通要素
======================================== */
.section-title {
    font-family: var(--font-serif);
    font-size: 38px;
    font-weight: 600;
    text-align: center;
    color: var(--text-dark);
    margin-bottom: 50px;
    line-height: 1.6;
    position: relative;
    padding-bottom: 20px;
}

.section-title::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 80px;
    height: 4px;
    background: linear-gradient(90deg, var(--primary-green), var(--accent-green));
    border-radius: 2px;
}

.subtitle-small {
    display: block;
    font-size: 20px;
    font-weight: 400;
    color: var(--text-medium);
    margin-top: 10px;
}

/* ========================================
   イントロセクション
======================================== */
.intro {
    padding: var(--section-padding);
    background: linear-gradient(180deg, #FFFFFF 0%, #F8FAF9 100%);
}

.intro-text {
    max-width: 800px;
    margin: 0 auto;
    text-align: center;
}

.intro-text p {
    font-size: 18px;
    line-height: 2;
    margin-bottom: 30px;
    color: var(--text-medium);
}

.intro-divider {
    width: 60px;
    height: 3px;
    background: linear-gradient(90deg, var(--primary-green), var(--accent-green));
    margin: 40px auto;
    border-radius: 2px;
    box-shadow: 0 2px 8px rgba(168, 213, 186, 0.3);
}

/* ========================================
   なぜ看護師が相談支援を
======================================== */
.why-nurses-want {
    padding: var(--section-padding);
    background: linear-gradient(135deg, var(--very-light-green) 0%, var(--soft-green) 100%);
    position: relative;
    overflow: hidden;
}

.why-nurses-want::before {
    content: '';
    position: absolute;
    top: -50px;
    right: -50px;
    width: 300px;
    height: 300px;
    background: radial-gradient(circle, rgba(168, 213, 186, 0.15) 0%, transparent 70%);
    border-radius: 50%;
}

.why-content {
    max-width: 900px;
    margin: 0 auto;
    position: relative;
    z-index: 1;
}

.why-content > p {
    font-size: 17px;
    line-height: 2.1;
    margin-bottom: 40px;
    text-align: center;
    color: var(--text-medium);
}

/* ========================================
   でも、仕事にしようとした瞬間に
======================================== */
.but-when-business {
    padding: var(--section-padding);
    background: white;
}

.business-concerns {
    max-width: 900px;
    margin: 0 auto;
}

.concern-intro {
    font-size: 18px;
    line-height: 2;
    text-align: center;
    margin-bottom: 50px;
    color: var(--text-medium);
}

.concern-list {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 20px;
    margin-bottom: 60px;
}

.concern-item {
    background: linear-gradient(135deg, #FFFFFF 0%, var(--bg-light) 100%);
    padding: 25px 20px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    gap: 15px;
    transition: all 0.3s ease;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
    border-left: 4px solid transparent;
}

.concern-item:hover {
    background: linear-gradient(135deg, var(--very-light-green) 0%, var(--soft-green) 100%);
    transform: translateY(-5px);
    box-shadow: 0 8px 20px rgba(168, 213, 186, 0.25);
    border-left-color: var(--primary-green);
}

.concern-icon {
    flex-shrink: 0;
    font-size: 24px;
}

.concern-item p {
    font-size: 16px;
    line-height: 1.7;
    color: var(--text-dark);
    margin: 0;
}

/* 新しいつまずきブロック用スタイル */
.stumbling-blocks {
    display: flex;
    flex-direction: column;
    gap: 25px;
    margin: 40px 0;
}

.stumbling-item {
    background: linear-gradient(135deg, #FFFFFF 0%, var(--bg-light) 100%);
    padding: 30px;
    border-radius: 12px;
    border-left: 5px solid var(--primary-green);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
    transition: all 0.3s ease;
}

.stumbling-item:hover {
    background: linear-gradient(135deg, var(--very-light-green) 0%, var(--soft-green) 100%);
    transform: translateX(8px);
    box-shadow: 0 6px 20px rgba(168, 213, 186, 0.3);
    border-left-color: var(--accent-green);
}

.stumbling-item h3 {
    font-size: 18px;
    font-weight: 700;
    color: var(--primary-green);
    margin-bottom: 12px;
    line-height: 1.5;
}

.stumbling-item p {
    font-size: 15px;
    line-height: 1.9;
    color: var(--text-medium);
    margin: 0;
}

.concern-message,
.concern-reason {
    background: linear-gradient(135deg, var(--very-light-green) 0%, white 100%);
    padding: 45px;
    border-radius: 16px;
    text-align: center;
    margin-top: 40px;
    box-shadow: 0 4px 20px rgba(168, 213, 186, 0.2);
    border: 2px solid var(--light-green);
}

.concern-message p,
.concern-reason {
    font-size: 17px;
    line-height: 2;
    color: var(--text-dark);
    margin-bottom: 20px;
}

.concern-message p:last-child {
    margin-bottom: 0;
}

/* ========================================
   理由セクション
======================================== */
.reasons {
    padding: var(--section-padding);
    background: linear-gradient(180deg, #F8FAF9 0%, #FFFFFF 100%);
}

.reasons-content {
    max-width: 800px;
    margin: 0 auto;
    text-align: center;
}

.reasons-intro,
.reasons-questions,
.reasons-answer,
.reasons-joy,
.reasons-mission {
    font-size: 17px;
    line-height: 2.1;
    margin-bottom: 35px;
    color: var(--text-medium);
}

/* 喜び・資産強調ボックス */
.joy-emphasis {
    background: linear-gradient(135deg, #FFF9E6 0%, #FFFBF0 100%);
    border: 3px solid #FFD700;
    border-radius: 20px;
    padding: 45px 40px;
    margin: 45px 0;
    box-shadow: 0 10px 30px rgba(255, 215, 0, 0.2);
    position: relative;
    overflow: hidden;
}

.joy-emphasis::before {
    content: '✨';
    position: absolute;
    top: 15px;
    right: 20px;
    font-size: 40px;
    opacity: 0.3;
}

.joy-emphasis p {
    font-size: 19px;
    line-height: 2.2;
    color: #5C4A00;
    margin: 0;
    position: relative;
    z-index: 1;
}

.joy-emphasis strong {
    font-weight: 700;
    color: #4A3900;
}

.reasons-highlight {
    background: linear-gradient(135deg, var(--primary-green) 0%, var(--accent-green) 100%);
    color: white;
    padding: 50px 40px;
    border-radius: 20px;
    margin: 50px 0;
    box-shadow: 0 12px 35px rgba(168, 213, 186, 0.4);
    position: relative;
    overflow: hidden;
}

.reasons-highlight::before {
    content: '💡';
    position: absolute;
    top: 20px;
    left: 20px;
    font-size: 48px;
    opacity: 0.2;
}

.reasons-highlight p {
    font-size: 19px;
    line-height: 2;
    margin: 0;
    font-weight: 500;
}

/* ========================================
   問題のつながり
======================================== */
.connected-problems {
    padding: var(--section-padding);
    background: white;
}

.connected-content {
    max-width: 900px;
    margin: 0 auto;
}

.connected-content > p {
    font-size: 17px;
    line-height: 2.1;
    margin-bottom: 35px;
    text-align: center;
    color: var(--text-medium);
}

.key-factor {
    background: linear-gradient(135deg, var(--very-light-green) 0%, #E1F5E9 100%);
    padding: 45px;
    border-radius: 16px;
    margin: 50px 0;
    text-align: center;
    box-shadow: 0 6px 20px rgba(168, 213, 186, 0.25);
    border: 2px solid var(--light-green);
}

.key-factor p {
    font-size: 18px;
    line-height: 2.2;
    margin: 0;
    color: var(--text-dark);
}

/* ========================================
   事例セクション（Case Studies）
======================================== */
.case-studies {
    padding: var(--section-padding);
    background: linear-gradient(180deg, #F8FAF9 0%, #FFFFFF 100%);
}

.case-studies .subtitle {
    font-size: 20px;
    font-weight: 400;
    color: var(--text-medium);
    display: block;
    margin-top: 10px;
}

.case-intro {
    max-width: 800px;
    margin: 0 auto 60px;
    text-align: center;
}

.case-intro p {
    font-size: 17px;
    line-height: 2.1;
    color: var(--text-medium);
    margin-bottom: 25px;
}

.case-intro p:last-child {
    margin-bottom: 0;
}

/* 各事例アイテム */
.case-item {
    background: white;
    border-left: 5px solid var(--primary-green);
    border-radius: 12px;
    padding: 40px 35px;
    margin-bottom: 40px;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.08);
    transition: all 0.3s ease;
}

.case-item:hover {
    transform: translateX(8px);
    box-shadow: 0 8px 25px rgba(168, 213, 186, 0.3);
    border-left-color: var(--accent-green);
    background: linear-gradient(135deg, #FFFFFF 0%, var(--very-light-green) 100%);
}

.case-title {
    font-size: 19px;
    font-weight: 700;
    color: var(--primary-green);
    margin-bottom: 25px;
    line-height: 1.6;
}

.case-content p {
    font-size: 16px;
    line-height: 2;
    color: var(--text-dark);
    margin-bottom: 20px;
}

.case-content p:last-child {
    margin-bottom: 0;
}

/* 感情リスト（事例2用） */
.emotion-list {
    display: inline-block;
    font-style: italic;
    color: var(--primary-green);
    padding-left: 20px;
    border-left: 3px solid var(--light-green);
    margin: 10px 0;
}

/* 本人の声（引用） */
.case-quote {
    background: linear-gradient(135deg, var(--very-light-green) 0%, #F0F9F4 100%);
    border-left: 4px solid var(--accent-green);
    padding: 25px 30px;
    margin: 25px 0;
    font-style: italic;
    border-radius: 8px;
}

/* 洞察・学び部分 */
.case-insight {
    background: linear-gradient(135deg, #FFF9E6 0%, #FFFBF0 100%);
    border-left: 4px solid #FFD700;
    padding: 20px 25px;
    margin: 20px 0;
    border-radius: 8px;
    font-weight: 500;
    color: #5C4A00;
}

/* 事例の締めくくり（サマリー） */
.case-summary {
    background: linear-gradient(135deg, var(--very-light-green) 0%, #E8F5EE 100%);
    border-left: 4px solid var(--primary-green);
    padding: 25px 30px;
    margin: 25px 0 0;
    border-radius: 8px;
    font-weight: 600;
    font-size: 16px;
    line-height: 2;
    color: var(--text-dark);
}

/* 締めくくりセクション */
.case-conclusion {
    background: linear-gradient(135deg, var(--primary-green) 0%, var(--accent-green) 100%);
    color: white;
    padding: 50px 40px;
    border-radius: 20px;
    margin-top: 60px;
    box-shadow: 0 12px 35px rgba(168, 213, 186, 0.4);
    text-align: center;
    position: relative;
    overflow: hidden;
}

.case-conclusion::before {
    content: '🌱';
    position: absolute;
    top: 20px;
    right: 30px;
    font-size: 60px;
    opacity: 0.15;
}

.case-conclusion p {
    font-size: 18px;
    line-height: 2.2;
    margin-bottom: 25px;
    position: relative;
    z-index: 1;
}

.case-conclusion p:last-child {
    margin-bottom: 0;
}

.case-mission {
    font-size: 20px !important;
    font-weight: 600;
    margin-top: 35px !important;
}

/* ========================================
   支援者のバイアス
======================================== */
.supporter-bias {
    padding: var(--section-padding);
    background: linear-gradient(180deg, #F8FAF9 0%, var(--very-light-green) 100%);
}

.bias-content {
    max-width: 900px;
    margin: 0 auto;
}

.bias-content > p {
    font-size: 17px;
    line-height: 2.1;
    margin-bottom: 35px;
    text-align: center;
    color: var(--text-medium);
}

/* エビデンスボックス */
.evidence-box {
    background: linear-gradient(135deg, #f0f9f4 0%, #e1f5e9 100%);
    padding: 45px;
    border-radius: 16px;
    margin: 50px 0;
    border: 3px solid var(--primary-green);
    box-shadow: 0 8px 30px rgba(107, 158, 126, 0.2);
    position: relative;
}

.evidence-box::before {
    content: '';
    position: absolute;
    top: -10px;
    left: 40px;
    width: 80px;
    height: 80px;
    background: linear-gradient(135deg, var(--primary-green), var(--accent-green));
    border-radius: 50%;
    opacity: 0.15;
}

.evidence-title {
    font-size: 21px;
    font-weight: 700;
    color: var(--dark-green);
    margin-bottom: 25px;
    position: relative;
    z-index: 1;
}

.evidence-box p {
    font-size: 16px;
    line-height: 2;
    color: var(--text-dark);
    margin-bottom: 20px;
}

.evidence-box p:last-child {
    margin-bottom: 0;
}

.evidence-flow {
    background: white;
    padding: 25px;
    border-radius: 12px;
    text-align: center;
    font-size: 17px !important;
    color: var(--dark-green) !important;
    font-weight: 600 !important;
    margin: 30px 0 !important;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.08);
}

/* ========================================
   支援者の偏り
======================================== */
.supporter-bias {
    padding: var(--section-padding);
    background: linear-gradient(180deg, #F8FAF9 0%, var(--very-light-green) 100%);
}

.bias-content {
    max-width: 900px;
    margin: 0 auto;
}

.bias-content > p,
.bias-deeper,
.bias-impact,
.bias-key {
    font-size: 17px;
    line-height: 2.1;
    margin-bottom: 35px;
    text-align: center;
    color: var(--text-medium);
}

.bias-examples {
    margin: 50px 0;
}

.bias-subtitle {
    font-size: 22px;
    font-weight: 600;
    color: var(--dark-green);
    text-align: center;
    margin-bottom: 30px;
}

.bias-example {
    background: white;
    padding: 25px 30px;
    border-radius: 12px;
    margin-bottom: 15px;
    border-left: 5px solid var(--primary-green);
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.06);
    transition: all 0.3s ease;
}

.bias-example:hover {
    transform: translateX(10px);
    box-shadow: 0 6px 25px rgba(168, 213, 186, 0.25);
}

.bias-example p {
    font-size: 16px;
    line-height: 1.9;
    color: var(--text-dark);
    margin: 0;
}

.fear-types {
    background: linear-gradient(135deg, var(--very-light-green) 0%, #E1F5E9 100%);
    padding: 45px;
    border-radius: 16px;
    margin: 50px 0;
    box-shadow: 0 6px 25px rgba(168, 213, 186, 0.2);
}

.fear-intro {
    font-size: 18px;
    font-weight: 600;
    color: var(--dark-green);
    margin-bottom: 25px;
    text-align: center;
}

.fear-list {
    list-style: none;
    padding: 0;
    margin: 0;
    text-align: left;
    max-width: 600px;
    margin: 0 auto;
}

.fear-list li {
    font-size: 16px;
    line-height: 2;
    color: var(--text-dark);
    padding: 12px 0 12px 35px;
    position: relative;
}

.fear-list li:before {
    content: "→";
    position: absolute;
    left: 0;
    color: var(--primary-green);
    font-weight: bold;
    font-size: 20px;
}

/* ========================================
   自己理解の重要性
======================================== */
.self-understanding {
    padding: var(--section-padding);
    background: white;
}

.understanding-content {
    max-width: 900px;
    margin: 0 auto;
}

.understanding-content > p,
.understanding-reason,
.understanding-result {
    font-size: 17px;
    line-height: 2.1;
    margin-bottom: 35px;
    text-align: center;
    color: var(--text-medium);
}

.understanding-emphasis {
    background: linear-gradient(135deg, var(--primary-green) 0%, var(--accent-green) 100%);
    color: white;
    padding: 50px 40px;
    border-radius: 20px;
    margin: 50px 0;
    box-shadow: 0 12px 35px rgba(168, 213, 186, 0.4);
    position: relative;
    overflow: hidden;
}

.understanding-emphasis::before {
    content: '🌟';
    position: absolute;
    bottom: 20px;
    right: 20px;
    font-size: 80px;
    opacity: 0.15;
}

.understanding-emphasis p {
    font-size: 19px;
    line-height: 2;
    margin: 0;
    text-align: center;
    font-weight: 500;
}

/* 比較表 */
.comparison-table-wrapper {
    margin: 50px 0;
    overflow-x: auto;
    border-radius: 16px;
    box-shadow: 0 6px 25px rgba(0, 0, 0, 0.12);
}

.comparison-table {
    width: 100%;
    border-collapse: collapse;
    background: white;
    border-radius: 16px;
    overflow: hidden;
}

.comparison-table thead {
    background: linear-gradient(135deg, var(--primary-green) 0%, var(--accent-green) 100%);
    color: white;
}

.comparison-table th {
    padding: 20px 25px;
    font-size: 17px;
    font-weight: 600;
    text-align: left;
}

.comparison-table tbody tr {
    border-bottom: 1px solid var(--bg-light);
    transition: all 0.2s ease;
}

.comparison-table tbody tr:last-child {
    border-bottom: none;
}

.comparison-table tbody tr:nth-child(even) {
    background: var(--very-light-green);
}

.comparison-table tbody tr:hover {
    background: var(--soft-green);
    transform: scale(1.01);
}

.comparison-table td {
    padding: 20px 25px;
    font-size: 15px;
    color: var(--text-dark);
    line-height: 1.8;
}

.comparison-table td:first-child {
    font-weight: 600;
    color: var(--dark-green);
}

.comparison-note {
    font-size: 14px;
    line-height: 1.9;
    color: var(--text-medium);
    margin-top: 25px;
    text-align: center;
    font-style: italic;
    padding: 15px;
    background: var(--bg-light);
    border-radius: 8px;
}

/* ========================================
   2部構成の説明
======================================== */
.two-parts-intro {
    padding: var(--section-padding);
    background: linear-gradient(135deg, var(--very-light-green) 0%, var(--soft-green) 50%, var(--very-light-green) 100%);
    position: relative;
    overflow: hidden;
}

.two-parts-intro::before {
    content: '';
    position: absolute;
    top: -100px;
    left: -100px;
    width: 400px;
    height: 400px;
    background: radial-gradient(circle, rgba(168, 213, 186, 0.2) 0%, transparent 70%);
    border-radius: 50%;
}

.parts-overview {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
    gap: 40px;
    margin-top: 50px;
    position: relative;
    z-index: 1;
}

.part-box {
    background: white;
    padding: 45px 35px;
    border-radius: 20px;
    box-shadow: 0 8px 30px rgba(168, 213, 186, 0.2);
    text-align: center;
    transition: all 0.4s ease;
    border: 3px solid transparent;
    position: relative;
    overflow: hidden;
}

.part-box::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 6px;
    background: linear-gradient(90deg, var(--primary-green), var(--accent-green));
}

.part-box:hover {
    transform: translateY(-10px);
    box-shadow: 0 15px 45px rgba(168, 213, 186, 0.35);
    border-color: var(--primary-green);
}

.part-title {
    font-size: 24px;
    font-weight: 700;
    color: var(--primary-green);
    margin-bottom: 20px;
    line-height: 1.6;
}

.part-theme {
    font-size: 21px;
    font-weight: 600;
    color: var(--text-dark);
    margin-bottom: 20px;
    line-height: 1.6;
}

.part-description {
    font-size: 16px;
    line-height: 1.9;
    color: var(--text-medium);
    margin-bottom: 25px;
}

/* トピックリスト */
.part-topics {
    list-style: none;
    padding: 0;
    margin: 20px 0 0;
}

.part-topics li {
    position: relative;
    padding-left: 30px;
    margin-bottom: 15px;
    font-size: 15px;
    line-height: 1.8;
    color: var(--text-dark);
}

.part-topics li:before {
    content: '✓';
    position: absolute;
    left: 0;
    top: 0;
    color: var(--primary-green);
    font-weight: 700;
    font-size: 18px;
}

.part-topics li:last-child {
    margin-bottom: 0;
}

.part-chapters {
    background: linear-gradient(135deg, var(--bg-light) 0%, var(--very-light-green) 100%);
    padding: 18px 25px;
    border-radius: 10px;
    margin-top: 20px;
}

.part-chapters p {
    font-size: 14px;
    color: var(--text-dark);
    margin: 0;
    font-weight: 600;
}

.parts-note {
    max-width: 800px;
    margin: 50px auto 0;
    padding: 35px;
    background: white;
    border-radius: 16px;
    text-align: center;
    border: 3px solid var(--primary-green);
    box-shadow: 0 6px 25px rgba(168, 213, 186, 0.2);
    position: relative;
    z-index: 1;
}

.parts-note p {
    font-size: 17px;
    line-height: 2;
    color: var(--text-dark);
    margin: 0;
}

/* ========================================
   セミナー内容（第1部・第2部）
======================================== */
.seminar-content {
    padding: var(--section-padding);
}

.seminar-content.part-1 {
    background: linear-gradient(180deg, white 0%, #F8FAF9 100%);
}

.seminar-content.part-2 {
    background: linear-gradient(180deg, #F8FAF9 0%, var(--very-light-green) 100%);
}

.part2-intro {
    max-width: 800px;
    margin: 0 auto 50px;
    text-align: center;
    font-size: 17px;
    line-height: 2.1;
    color: var(--text-medium);
}

.chapters-wrapper {
    max-width: 900px;
    margin: 0 auto;
}

.chapter-card {
    background: white;
    padding: 45px;
    border-radius: 20px;
    margin-bottom: 40px;
    box-shadow: 0 6px 25px rgba(0, 0, 0, 0.1);
    border-left: 6px solid var(--primary-green);
    transition: all 0.3s ease;
    position: relative;
}

.chapter-card::before {
    content: '';
    position: absolute;
    top: -3px;
    right: -3px;
    bottom: -3px;
    left: -3px;
    background: linear-gradient(135deg, var(--primary-green), var(--accent-green));
    border-radius: 20px;
    opacity: 0;
    transition: opacity 0.3s ease;
    z-index: -1;
}

.chapter-card:hover::before {
    opacity: 0.1;
}

.chapter-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 12px 40px rgba(168, 213, 186, 0.25);
}

.chapter-header {
    margin-bottom: 25px;
}

.chapter-number {
    display: inline-block;
    background: linear-gradient(135deg, var(--primary-green), var(--accent-green));
    color: white;
    padding: 10px 24px;
    border-radius: 25px;
    font-size: 14px;
    font-weight: 600;
    margin-bottom: 15px;
    box-shadow: 0 4px 12px rgba(168, 213, 186, 0.3);
}

.chapter-title {
    font-size: 24px;
    font-weight: 600;
    color: var(--text-dark);
    line-height: 1.6;
    margin: 0;
}

.chapter-content {
    margin-top: 25px;
}

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

.chapter-points li {
    font-size: 16px;
    line-height: 2;
    color: var(--text-dark);
    padding: 12px 0 12px 35px;
    position: relative;
}

.chapter-points li:before {
    content: "●";
    position: absolute;
    left: 0;
    color: var(--primary-green);
    font-size: 14px;
    top: 16px;
}

/* ========================================
   セミナー参加特典
======================================== */
.benefits-bonus {
    padding: var(--section-padding);
    background: linear-gradient(135deg, var(--very-light-green) 0%, white 50%, var(--very-light-green) 100%);
    position: relative;
}

.benefits-bonus::before {
    content: '🎁';
    position: absolute;
    top: 80px;
    right: 50px;
    font-size: 120px;
    opacity: 0.08;
}

.bonus-content {
    max-width: 900px;
    margin: 0 auto;
    position: relative;
    z-index: 1;
}

.bonus-intro {
    text-align: center;
    font-size: 18px;
    line-height: 2;
    color: var(--text-dark);
    margin-bottom: 50px;
}

.bonus-box {
    background: white;
    padding: 50px 45px;
    border-radius: 20px;
    box-shadow: 0 10px 40px rgba(168, 213, 186, 0.25);
    border: 4px solid var(--primary-green);
    position: relative;
    overflow: hidden;
}

.bonus-box::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 8px;
    background: linear-gradient(90deg, var(--primary-green), var(--accent-green), var(--primary-green));
}

.bonus-title {
    font-size: 26px;
    font-weight: 700;
    color: var(--dark-green);
    text-align: center;
    margin-bottom: 30px;
}

.bonus-description,
.bonus-purpose {
    font-size: 17px;
    line-height: 2.1;
    color: var(--text-dark);
    margin-bottom: 30px;
    text-align: center;
}

.bonus-note {
    background: var(--bg-light);
    padding: 25px 30px;
    border-radius: 12px;
    font-size: 15px;
    line-height: 1.9;
    color: var(--text-medium);
    margin-top: 30px;
    text-align: center;
    border-left: 4px solid var(--primary-green);
}

/* ========================================
   開催概要
======================================== */
.schedule {
    padding: var(--section-padding);
    background: white;
}

.schedule-subtitle {
    text-align: center;
    font-size: 18px;
    line-height: 1.8;
    color: var(--text-medium);
    margin-bottom: 50px;
}

.schedule-box {
    max-width: 800px;
    margin: 0 auto;
    background: linear-gradient(135deg, #F8FAF9 0%, var(--very-light-green) 100%);
    padding: 45px;
    border-radius: 20px;
    box-shadow: 0 6px 25px rgba(0, 0, 0, 0.08);
    border: 2px solid var(--light-green);
    position: relative;
    z-index: 1;
}

.schedule-item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 22px 0;
    border-bottom: 2px dashed var(--light-green);
}

.schedule-item:last-of-type {
    border-bottom: none;
}

.schedule-label {
    font-weight: 600;
    color: var(--text-dark);
    font-size: 16px;
}

.schedule-value {
    color: var(--text-medium);
    font-size: 16px;
}

.schedule-dates {
    margin-top: 40px;
}

.date-group {
    background: white;
    padding: 35px;
    border-radius: 16px;
    margin-bottom: 20px;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.06);
    border-left: 5px solid var(--primary-green);
}

.date-group-title {
    font-size: 20px;
    font-weight: 600;
    color: var(--dark-green);
    margin-bottom: 15px;
}

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

.date-list li {
    font-size: 17px;
    font-weight: 500;
    color: var(--text-dark);
    padding: 12px 0 12px 30px;
    position: relative;
    line-height: 1.6;
}

.date-list li:before {
    content: "🕐";
    position: absolute;
    left: 0;
    font-size: 18px;
}

.date-status {
    font-size: 16px;
    color: var(--text-medium);
    margin: 0;
}

.schedule-note {
    margin-top: 40px;
    padding-top: 30px;
    border-top: 3px dashed var(--primary-green);
}

.schedule-note p {
    font-size: 15px;
    line-height: 1.9;
    color: var(--text-medium);
    margin-bottom: 15px;
    text-align: center;
}

.schedule-note p:last-child {
    margin-bottom: 0;
}

.bonus-reminder {
    max-width: 800px;
    margin: 40px auto 0;
    padding: 40px;
    background: linear-gradient(135deg, var(--very-light-green) 0%, white 100%);
    border-radius: 16px;
    border: 3px solid var(--primary-green);
    text-align: center;
    box-shadow: 0 6px 25px rgba(168, 213, 186, 0.2);
    position: relative;
    z-index: 1;
}

.bonus-reminder-title {
    font-size: 22px;
    font-weight: 700;
    color: var(--dark-green);
    margin-bottom: 18px;
}

.bonus-reminder-text {
    font-size: 16px;
    line-height: 2;
    color: var(--text-dark);
    margin: 0;
}

.bonus-reminder-note {
    display: block;
    font-size: 14px;
    color: var(--text-medium);
    margin-top: 12px;
    font-style: italic;
}

/* ========================================
   おすすめ対象
======================================== */
.recommended {
    padding: var(--section-padding);
    background: linear-gradient(180deg, #F8FAF9 0%, var(--very-light-green) 100%);
}

.recommend-list {
    max-width: 800px;
    margin: 0 auto;
}

.recommend-item {
    background: white;
    padding: 22px 28px;
    border-radius: 12px;
    margin-bottom: 15px;
    display: flex;
    align-items: flex-start;
    gap: 15px;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.06);
    transition: all 0.3s ease;
    border-left: 4px solid transparent;
}

.recommend-item:hover {
    background: linear-gradient(135deg, var(--very-light-green) 0%, white 100%);
    transform: translateX(8px);
    box-shadow: 0 6px 25px rgba(168, 213, 186, 0.2);
    border-left-color: var(--primary-green);
}

.recommend-icon {
    flex-shrink: 0;
    width: 24px;
    font-size: 20px;
    color: var(--primary-green);
    font-weight: bold;
}

.recommend-item p {
    font-size: 16px;
    line-height: 1.9;
    color: var(--text-dark);
    margin: 0;
}

/* ========================================
   セミナーの位置づけ
======================================== */
.seminar-position {
    padding: var(--section-padding);
    background: white;
}

.position-content {
    max-width: 800px;
    margin: 0 auto;
    text-align: center;
}

.position-content > p {
    font-size: 17px;
    line-height: 2.1;
    margin-bottom: 35px;
    color: var(--text-medium);
}

.position-purpose {
    background: linear-gradient(135deg, var(--very-light-green) 0%, #E1F5E9 100%);
    padding: 45px;
    border-radius: 16px;
    margin: 50px 0;
    border-left: 6px solid var(--primary-green);
    font-size: 18px !important;
    line-height: 2 !important;
    color: var(--text-dark) !important;
    box-shadow: 0 6px 25px rgba(168, 213, 186, 0.2);
}

/* ========================================
   講師プロフィール
======================================== */
.instructor {
    padding: var(--section-padding);
    background: linear-gradient(180deg, #F8FAF9 0%, white 100%);
}

.instructor-profile {
    max-width: 900px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 200px 1fr;
    gap: 50px;
    align-items: start;
    background: white;
    padding: 40px;
    border-radius: 20px;
    box-shadow: 0 6px 25px rgba(0, 0, 0, 0.08);
}

.instructor-image img {
    width: 100%;
    border-radius: 50%;
    box-shadow: 0 6px 20px rgba(168, 213, 186, 0.3);
    border: 4px solid var(--light-green);
}

.instructor-name {
    font-size: 28px;
    font-weight: 600;
    color: var(--text-dark);
    margin-bottom: 10px;
}

.instructor-title {
    font-size: 16px;
    color: var(--text-medium);
    margin-bottom: 20px;
}

.instructor-credentials {
    margin-bottom: 25px;
    padding: 15px 20px;
    background: var(--very-light-green);
    border-radius: 10px;
    border-left: 4px solid var(--primary-green);
}

.instructor-credentials p {
    font-size: 15px;
    line-height: 1.8;
    color: var(--text-dark);
    margin: 0;
    font-weight: 500;
}

.instructor-bio p {
    font-size: 16px;
    line-height: 2;
    color: var(--text-dark);
    margin-bottom: 20px;
}

.instructor-bio p:last-child {
    margin-bottom: 0;
}

/* ========================================
   FAQ
======================================== */
.faq {
    padding: var(--section-padding);
    background: linear-gradient(180deg, white 0%, #F8FAF9 100%);
}

.faq-list {
    max-width: 900px;
    margin: 0 auto;
}

.faq-item {
    background: white;
    padding: 35px;
    border-radius: 16px;
    margin-bottom: 20px;
    border-left: 5px solid var(--primary-green);
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.06);
    transition: all 0.3s ease;
}

.faq-item:hover {
    transform: translateY(-3px);
    box-shadow: 0 8px 30px rgba(168, 213, 186, 0.2);
}

.faq-question {
    font-size: 18px;
    font-weight: 600;
    color: var(--text-dark);
    margin-bottom: 18px;
    line-height: 1.6;
}

.faq-answer {
    font-size: 16px;
    line-height: 2;
    color: var(--text-medium);
    margin: 0;
}

/* ========================================
   最終CTA
======================================== */
.final-cta {
    padding: calc(var(--section-padding) * 1.2);
    background: linear-gradient(135deg, var(--very-light-green) 0%, var(--soft-green) 50%, var(--very-light-green) 100%);
    position: relative;
    overflow: hidden;
}

.final-cta::before {
    content: '';
    position: absolute;
    top: -150px;
    right: -150px;
    width: 500px;
    height: 500px;
    background: radial-gradient(circle, rgba(168, 213, 186, 0.2) 0%, transparent 70%);
    border-radius: 50%;
}

.final-title {
    font-family: var(--font-serif);
    font-size: 34px;
    font-weight: 600;
    text-align: center;
    color: var(--text-dark);
    margin-bottom: 40px;
    line-height: 1.6;
    position: relative;
    z-index: 1;
}

.final-text {
    max-width: 700px;
    margin: 0 auto 35px;
    text-align: center;
    font-size: 17px;
    line-height: 2.1;
    color: var(--text-medium);
    position: relative;
    z-index: 1;
}

.hero-cta {
    text-align: center;
    margin: 30px 0;
    position: relative;
    z-index: 100;
}

.cta-center {
    text-align: center;
    margin: 50px 0;
    position: relative;
    z-index: 100;
}

.cta-button {
    display: inline-block;
    background: linear-gradient(135deg, var(--primary-green) 0%, var(--accent-green) 100%);
    color: white;
    padding: 22px 55px;
    border-radius: 50px;
    font-size: 19px;
    font-weight: 600;
    text-decoration: none;
    box-shadow: 0 8px 25px rgba(168, 213, 186, 0.4);
    transition: all 0.3s ease;
    position: relative;
    cursor: pointer !important;
    pointer-events: auto !important;
    z-index: 100 !important;
}

.cta-button::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(135deg, var(--accent-green) 0%, var(--primary-green) 100%);
    border-radius: 50px;
    opacity: 0;
    transition: opacity 0.3s ease;
    pointer-events: none !important;
    z-index: -1;
}

.cta-button:hover {
    transform: translateY(-5px);
    box-shadow: 0 12px 35px rgba(168, 213, 186, 0.5);
}

.cta-button:hover::before {
    opacity: 1;
}

.cta-button.primary {
    background: linear-gradient(135deg, var(--primary-green) 0%, var(--accent-green) 100%);
}

.cta-button.large {
    padding: 24px 65px;
    font-size: 20px;
    z-index: 100 !important;
}

.cta-note {
    font-size: 14px;
    color: var(--text-medium);
    margin-top: 18px;
}

.final-note {
    max-width: 600px;
    margin: 50px auto 0;
    text-align: center;
    position: relative;
    z-index: 1;
}

.final-note p {
    font-size: 19px;
    line-height: 2;
    color: var(--text-dark);
    font-weight: 500;
}

/* ========================================
   フッター
======================================== */
.footer {
    background: linear-gradient(135deg, #2C3E36 0%, #1F2D27 100%);
    color: white;
    padding: 50px 0;
    text-align: center;
}

.footer-copy {
    font-size: 14px;
    margin-bottom: 15px;
    opacity: 0.9;
}

.footer-link a {
    color: var(--light-green);
    text-decoration: none;
    font-size: 14px;
    transition: all 0.3s ease;
}

.footer-link a:hover {
    text-decoration: underline;
    color: var(--primary-green);
}

/* ========================================
   レスポンシブ対応
======================================== */
@media (max-width: 768px) {
    :root {
        --section-padding: 50px 0;
    }
    
    /* 余白を最小限に */
    .container {
        padding: 0 16px !important;
    }
    
    /* ヒーローセクション */
    .hero {
        padding: 50px 0 40px !important;
    }
    
    .hero-content {
        text-align: left !important;
    }
    
    .hero-label {
        font-size: 13px;
        margin-bottom: 15px;
        text-align: center;
    }
    
    .main-title {
        font-size: 24px !important;
        margin-bottom: 20px;
        line-height: 1.6 !important;
        text-align: center;
    }
    
    .subtitle {
        font-size: 15px !important;
        margin-bottom: 20px;
        text-align: center;
    }
    
    .hero-intro {
        font-size: 15px !important;
        padding: 18px 16px !important;
        margin-bottom: 25px;
        text-align: left !important;
        line-height: 1.8 !important;
    }
    
    .hero-cta {
        text-align: center;
    }
    
    /* セクションタイトル */
    .section-title {
        font-size: 22px !important;
        margin-bottom: 35px;
        line-height: 1.6;
    }
    
    /* 本文テキスト：左寄せに変更 */
    .intro-text,
    .why-content,
    .connected-content,
    .reasons-content,
    .bias-content,
    .understanding-content,
    .position-content {
        text-align: left !important;
    }
    
    .intro-text p,
    .why-content > p,
    .connected-content > p,
    .reasons-intro,
    .reasons-questions,
    .reasons-answer,
    .reasons-joy,
    .bias-content > p,
    .understanding-content > p,
    .position-content > p {
        font-size: 15px !important;
        line-height: 1.8 !important;
        text-align: left !important;
    }
    
    /* 不安・悩みリスト */
    .concern-intro {
        font-size: 15px !important;
        text-align: left !important;
    }
    
    /* つまずきブロック */
    .stumbling-item {
        padding: 20px 16px !important;
    }
    
    .stumbling-item h3 {
        font-size: 17px !important;
        margin-bottom: 10px;
    }
    
    .stumbling-item p {
        font-size: 15px !important;
    }
    
    /* 強調ボックス */
    .concern-message {
        padding: 25px 18px !important;
        font-size: 15px !important;
        text-align: left !important;
    }
    
    .reasons-highlight,
    .joy-emphasis,
    .understanding-emphasis,
    .key-factor {
        padding: 30px 18px !important;
        text-align: left !important;
    }
    
    .reasons-highlight p,
    .joy-emphasis p,
    .understanding-emphasis p,
    .key-factor p {
        font-size: 16px !important;
        text-align: left !important;
        line-height: 1.8 !important;
    }
    
    /* 事例セクション */
    .case-studies .subtitle {
        font-size: 15px;
    }
    
    .case-intro {
        text-align: left !important;
    }
    
    .case-intro p {
        text-align: left !important;
    }
    
    .case-item {
        padding: 25px 16px !important;
    }
    
    .case-title {
        font-size: 16px !important;
        line-height: 1.6;
    }
    
    .case-content p {
        font-size: 15px !important;
        text-align: left !important;
        line-height: 1.8 !important;
    }
    
    /* 枠の中の枠：余白を最小限に */
    .case-quote {
        padding: 16px 12px !important;
        margin: 20px 0 !important;
        border-left-width: 3px !important;
    }
    
    .case-summary {
        padding: 16px 12px !important;
        margin: 20px 0 0 !important;
        font-size: 15px !important;
        border-left-width: 3px !important;
    }
    
    .case-conclusion {
        padding: 35px 20px;
        text-align: left !important;
    }
    
    .case-conclusion p {
        font-size: 15px;
        text-align: left !important;
    }
    
    .case-mission {
        font-size: 16px !important;
    }
    
    /* 2部構成 */
    .parts-overview {
        grid-template-columns: 1fr;
        gap: 25px;
    }
    
    .part-box {
        padding: 30px 20px !important;
    }
    
    .part-title {
        font-size: 20px !important;
    }
    
    .part-topics li {
        font-size: 15px !important;
        padding-left: 25px;
        margin-bottom: 12px;
    }
    
    .part-topics li:before {
        font-size: 16px;
    }
    
    /* 特典 */
    .bonus-intro {
        text-align: left !important;
    }
    
    .bonus-box {
        padding: 30px 18px !important;
    }
    
    .bonus-title {
        font-size: 20px !important;
        text-align: left !important;
    }
    
    .bonus-description,
    .bonus-purpose {
        text-align: left !important;
    }
    
    .bonus-reminder {
        padding: 25px 18px;
        text-align: left !important;
    }
    
    /* 開催概要 */
    .schedule-box {
        padding: 25px 18px !important;
    }
    
    .schedule-item {
        flex-direction: column;
        align-items: flex-start;
        gap: 8px;
        padding: 18px 0;
    }
    
    .schedule-label,
    .schedule-value {
        font-size: 15px !important;
    }
    
    .schedule-note p {
        text-align: left !important;
    }
    
    /* 日程リスト */
    .date-group {
        padding: 25px 18px !important;
    }
    
    .date-group-title {
        font-size: 17px !important;
    }
    
    .date-list li {
        font-size: 15px !important;
        padding: 10px 0 10px 28px !important;
    }
    
    .date-list li:before {
        font-size: 16px !important;
    }
    
    /* おすすめ対象 */
    .recommend-item {
        padding: 18px 16px !important;
    }
    
    .recommend-item p {
        font-size: 15px !important;
        text-align: left !important;
    }
    
    /* 講師プロフィール */
    .instructor-profile {
        grid-template-columns: 1fr;
        gap: 25px;
        text-align: left !important;
        padding: 30px 18px !important;
    }
    
    .instructor-image {
        max-width: 180px;
        margin: 0 auto;
    }
    
    .instructor-name {
        font-size: 22px !important;
        text-align: center;
    }
    
    .instructor-title {
        text-align: center;
    }
    
    .instructor-bio p {
        font-size: 15px !important;
        text-align: left !important;
        line-height: 1.8 !important;
    }
    
    /* FAQ */
    .faq-item {
        padding: 25px 16px !important;
    }
    
    .faq-question {
        font-size: 16px !important;
        margin-bottom: 15px;
        text-align: left !important;
    }
    
    .faq-answer {
        font-size: 15px !important;
        text-align: left !important;
        line-height: 1.8 !important;
    }
    
    /* エビデンスボックス */
    .evidence-box {
        padding: 30px 18px !important;
        text-align: left !important;
    }
    
    .evidence-title {
        font-size: 18px;
        text-align: left !important;
    }
    
    .evidence-box p {
        font-size: 15px;
        text-align: left !important;
    }
    
    /* セクション画像 */
    .section-image {
        max-width: 100%;
        margin: 0 auto 40px;
    }
    
    .section-image img {
        border-radius: 12px;
    }
    
    /* CTA */
    .cta-button {
        padding: 18px 40px !important;
        font-size: 16px !important;
    }
    
    .cta-button.large {
        padding: 20px 45px;
        font-size: 17px;
    }
    
    .final-title {
        font-size: 24px !important;
        text-align: center;
    }
    
    .final-text {
        font-size: 15px !important;
        text-align: left !important;
        line-height: 1.8 !important;
    }
    
    .final-note p {
        text-align: center !important;
    }
    
    .joy-emphasis::before {
        font-size: 30px;
        top: 10px;
        right: 15px;
    }
    
    /* 章カード */
    .chapter-card {
        padding: 35px 25px;
    }
    
    .chapter-title {
        font-size: 20px;
    }
    
    /* ハイライトボックス */
    .fear-types {
        padding: 30px 18px !important;
        text-align: left !important;
    }
    
    .fear-intro {
        text-align: left !important;
    }
    
    .bias-examples {
        text-align: left !important;
    }
    
    .bias-subtitle {
        text-align: left !important;
    }
}

@media (max-width: 480px) {
    :root {
        --section-padding: 40px 0;
    }
    
    /* さらに余白削減 */
    .container {
        padding: 0 12px !important;
    }
    
    /* ヒーローセクション */
    .hero {
        padding: 40px 0 35px !important;
    }
    
    .hero-label {
        font-size: 12px;
    }
    
    .main-title {
        font-size: 22px !important;
        line-height: 1.6 !important;
    }
    
    .subtitle {
        font-size: 14px !important;
    }
    
    .hero-intro {
        font-size: 14px !important;
        padding: 16px 14px !important;
        line-height: 1.7 !important;
    }
    
    /* セクションタイトル */
    .section-title {
        font-size: 20px !important;
        margin-bottom: 30px;
    }
    
    /* 本文テキスト */
    .intro-text p,
    .why-content > p,
    .connected-content > p,
    .case-intro p,
    .case-content p {
        font-size: 14px !important;
        line-height: 1.75 !important;
    }
    
    /* CTA */
    .cta-button {
        padding: 16px 35px !important;
        font-size: 15px !important;
    }
    
    .cta-button.large {
        padding: 18px 40px !important;
        font-size: 16px !important;
    }
    
    /* 枠の中の枠：さらに余白削減 */
    .case-quote {
        padding: 14px 10px !important;
        margin: 15px 0 !important;
        font-size: 14px !important;
    }
    
    .case-summary {
        padding: 14px 10px !important;
        margin: 15px 0 0 !important;
        font-size: 14px !important;
    }
    
    .part-title {
        font-size: 18px !important;
    }
    
    .bonus-title {
        font-size: 19px !important;
    }
    
    .final-title {
        font-size: 21px !important;
    }
    
    .case-title {
        font-size: 15px !important;
    }
    
    .faq-question {
        font-size: 15px !important;
    }
    
    .faq-answer {
        font-size: 14px !important;
    }
    
    /* 比較表 - スマホ専用：通常の表形式を維持 */
    .comparison-table-wrapper {
        margin: 30px 0 !important;
        overflow-x: auto !important;
        -webkit-overflow-scrolling: touch !important;
    }
    
    .comparison-table {
        font-size: 13px !important;
        width: 100% !important;
        min-width: 500px !important; /* 最小幅を確保 */
    }
    
    .comparison-table th,
    .comparison-table td {
        padding: 12px 10px !important;
        font-size: 13px !important;
    }
    
    .comparison-table th {
        font-size: 14px !important;
    }
    
    .comparison-note {
        font-size: 13px !important;
        padding: 12px !important;
        text-align: left !important;
    }
    
    /* ========================================
       スマホ：セクションごとのtext-align最適化
    ======================================== */
    
    /* 中央寄せ：タイトル・キャッチコピー・強調メッセージ */
    .hero-label,
    .main-title,
    .subtitle,
    .section-title,
    .reasons-highlight p,
    .joy-emphasis p,
    .key-factor p,
    .understanding-emphasis p,
    .case-conclusion p {
        text-align: center !important;
    }
    
    /* 左寄せ：本文（読みやすさ優先） */
    .hero-intro,
    .intro-text p,
    .why-content p,
    .business-concerns p,
    .concern-intro,
    .concern-message,
    .stumbling-item p,
    .reasons-intro,
    .reasons-questions,
    .reasons-answer,
    .reasons-joy,
    .connected-content p,
    .case-intro p,
    .case-content p,
    .bias-content p,
    .understanding-content > p,
    .understanding-reason,
    .understanding-result,
    .two-parts-intro p,
    .part-topics li,
    .schedule-info p,
    .target-content p,
    .position-content p,
    .instructor-text p,
    .faq-answer {
        text-align: left !important;
    }
    
    /* 行間調整：自然な改行を促進 */
    .intro-text p,
    .why-content p,
    .business-concerns p,
    .reasons-content p,
    .connected-content p,
    .case-content p {
        line-height: 1.85 !important;
        margin-bottom: 22px !important;
    }
}

    /* エビデンスボックス（スマホ） */
    .evidence-box {
        padding: 25px 18px;
    }
    
    .evidence-title {
        font-size: 16px;
    }
    
    .evidence-box p {
        font-size: 14px;
    }
    
    /* 比較表（スマホ） */
    .comparison-table {
        font-size: 12px;
        display: block;
    }
    
    .comparison-table-wrapper {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }
    
    .comparison-table th,
    .comparison-table td {
        padding: 12px 10px;
        font-size: 12px;
    }
    
    .comparison-note {
        font-size: 12px;
    }
    
    .instructor-profile {
        padding: 25px 18px;
    }
}