/* Declaration page module tabs. Keep this file in so Vue (#app) cannot strip it. */ .decl-tabs { position: relative; margin: 4px 0 0; } .decl-tabs__radio { position: absolute; left: 0; top: 0; width: 1px; height: 1px; margin: 0; padding: 0; overflow: hidden; clip: rect(0, 0, 0, 0); border: 0; opacity: 0; } .decl-tabs__bar { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; } .policy-page-body .decl-tabs__tab, .decl-tabs__tab { display: flex !important; justify-content: center !important; align-items: center !important; box-sizing: border-box !important; width: 100% !important; min-height: 42px !important; padding: 8px 10px !important; margin: 0 !important; font-size: 15px !important; font-weight: 600 !important; line-height: 1.25 !important; text-align: center !important; color: #2f3b4a !important; background: #f7f9fb !important; border: 1px solid #dde3ea !important; border-radius: 6px !important; text-decoration: none !important; cursor: pointer; } .policy-page-body .decl-tabs__tab:hover, .decl-tabs__tab:hover { color: #111111 !important; background: #eef2f6 !important; text-decoration: none !important; } #decl-tab-q1:checked ~ .decl-tabs__bar [for="decl-tab-q1"], #decl-tab-q2:checked ~ .decl-tabs__bar [for="decl-tab-q2"], #decl-tab-q3:checked ~ .decl-tabs__bar [for="decl-tab-q3"], #decl-tab-q4:checked ~ .decl-tabs__bar [for="decl-tab-q4"], #decl-tab-q5:checked ~ .decl-tabs__bar [for="decl-tab-q5"], #decl-tab-q6:checked ~ .decl-tabs__bar [for="decl-tab-q6"], #decl-tab-q7:checked ~ .decl-tabs__bar [for="decl-tab-q7"] { color: #ffffff !important; background: #2f3b4a !important; border-color: #2f3b4a !important; } .decl-tabs__panels { margin-top: 12px; padding: 16px 18px 18px; border: 1px solid #dde3ea; background: #ffffff; } .decl-tabs__panel { display: none !important; } #decl-tab-q1:checked ~ .decl-tabs__panels > [data-panel="q1"], #decl-tab-q2:checked ~ .decl-tabs__panels > [data-panel="q2"], #decl-tab-q3:checked ~ .decl-tabs__panels > [data-panel="q3"], #decl-tab-q4:checked ~ .decl-tabs__panels > [data-panel="q4"], #decl-tab-q5:checked ~ .decl-tabs__panels > [data-panel="q5"], #decl-tab-q6:checked ~ .decl-tabs__panels > [data-panel="q6"], #decl-tab-q7:checked ~ .decl-tabs__panels > [data-panel="q7"] { display: block !important; } .decl-tabs__panel .faq-section-title { margin-top: 0; margin-bottom: 12px; font-size: 18px; font-weight: 700; color: #2f3b4a; border-bottom: 1px solid #e5e7eb; padding-bottom: 8px; } .decl-tabs__panel p { line-height: 1.75; color: #444; margin-bottom: 10px; } .decl-tabs__panel ol, .decl-tabs__panel ul { line-height: 1.75; color: #444; padding-left: 1.4em; } .decl-tabs__panel li { margin-bottom: 8px; } .decl-tabs__panel .policy-notice { padding: 10px 12px; background: #f8fafc; border-left: 3px solid #94a3b8; margin: 12px 0 0; } .decl-tabs__panel .policy-notice p { margin-bottom: 8px; } .decl-tabs__panel .policy-notice p:last-child { margin-bottom: 0; } @media (max-width: 767px) { .decl-tabs__bar { grid-template-columns: repeat(2, minmax(0, 1fr)); } }