.btn_ptn_1,.btn_ptn_2{padding:14px 28px;min-height:56px;display:inline-flex;align-items:center;justify-content:center;gap:14px;font-size:16px;font-weight:900;line-height:1.4em;border-radius:5px;white-space:nowrap;transition:opacity .2s;@media (hover: hover){&:hover{opacity:.85}}}.btn_ptn_1{background:var(--color-btn-bg, #0a63d8);color:var(--color-btn, #fff)}.btn_ptn_2{color:var(--color-btn-line, #fff);border:1px solid var(--color-btn-line, #fff)}#kr-brain.sec_brain_hero{padding:20px 32px 96px;background:#0b2247;color:#fff;@media (max-width: 750px){padding:18px 24px 72px}@media (max-width: 500px){padding:16px 20px 64px}>.wrap{margin:0 auto;max-width:1320px}.breadcrumb{display:flex;align-items:center;gap:11px;color:#a5bddb;font-size:12px;a {color: inherit;} @media (hover: hover) {a:hover {text-decoration: underline;}}}.hero_grid{padding-top:88px;display:grid;grid-template-columns:minmax(0,1fr) minmax(280px,.38fr);align-items:end;gap:72px;@media (max-width: 1200px){gap:48px}@media (max-width: 1100px){padding-top:64px;grid-template-columns:1fr}@media (max-width: 500px){padding-top:48px;gap:40px}}.kicker{color:#8cbdff;font-size:12px;font-weight:900;letter-spacing:.15em}h1.ttl {margin: 24px 0; color: #fff; font-size: 60px; font-weight: 900; line-height: 1.35em; letter-spacing: -.04em; @media (max-width: 1200px) {font-size: 56px;} @media (max-width: 950px) {font-size: 52px;} @media (max-width: 750px) {font-size: 48px;} @media (max-width: 600px) {font-size: 44px;} @media (max-width: 560px) {font-size: 40px;} @media (max-width: 510px) {font-size: 36px;} @media (max-width: 455px) {font-size: 32px;} @media (max-width: 410px) {font-size: 28px;} @media (max-width: 380px) {font-size: 26px;} span {color: #86bdff;}} .lead {max-width: 680px; color: #e0eafa; font-size: 20px; line-height: 1.9em; @media (max-width: 500px) {font-size: 16px;}} .btns {margin-top: 36px; display: flex; flex-wrap: wrap; gap: 16px; .btn_ptn_1 { --color-btn-bg: #fff; --color-btn: #075fcf; } @media (max-width: 500px) {flex-direction: column; a {width: 100%;}}} .points {padding-top: 24px; display: grid; gap: 22px; border-top: 3px solid #82b9ff; @media (max-width: 1100px) {grid-template-columns: repeat(3,minmax(0,1fr)); gap: 24px;} @media (max-width: 600px) {grid-template-columns: 1fr; gap: 18px;} .row {display: grid; gap: 6px;} dt {color: #b5c9e4; font-size: 14px; font-weight: 700;} dd {color: #fff; font-size: 40px; font-weight: 900; line-height: 1.2em; letter-spacing: -.02em; @media (max-width: 500px) {font-size: 36px;} small {margin-left: 4px; font-size: 16px; font-weight: 700; letter-spacing: 0;}}}}.sec_brain_skill{padding:104px 32px 96px;background:#fdfcf9;color:#142a49;@media (max-width: 750px){padding:80px 24px 72px}@media (max-width: 500px){padding:64px 20px 56px}>.wrap{margin:0 auto;max-width:960px}.chapter{margin-bottom:16px;color:#0864d7;font-size:12px;font-weight:900;letter-spacing:.15em}h2.ttl {margin-bottom: 28px; color: #122b4b; font-size: 40px; font-weight: 900; line-height: 1.5em; letter-spacing: -.04em; @media (max-width: 950px) {font-size: 36px;} @media (max-width: 750px) {font-size: 32px;} @media (max-width: 500px) {font-size: 28px;} @media (max-width: 400px) {font-size: 24px;} .ib {display: inline-block;}} .text {color: #445771; font-size: 18px; line-height: 2em; @media (max-width: 500px) {font-size: 16px;}} .list {margin-top: 40px; display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 20px; @media (max-width: 750px) {grid-template-columns: 1fr; gap: 14px;} li {padding: 26px 24px; display: grid; align-content: start; gap: 10px; background: #fff; border: 1px solid #d5e1ed; border-radius: 8px;} strong {color: #122b4b; font-size: 18px; font-weight: 900; line-height: 1.5em;} span {color: #445771; font-size: 15px; line-height: 1.8em;}} .link {margin-top: 32px; display: inline-flex; align-items: center; gap: 10px; color: #0864d7; font-size: 16px; font-weight: 700; text-decoration: underline; text-underline-offset: 4px;}}.sec_brain_buy{padding:104px 32px 96px;background:#fff;color:#142a49;@media (max-width: 750px){padding:80px 24px 72px}@media (max-width: 500px){padding:64px 20px 56px}>.wrap{margin:0 auto;max-width:960px}.chapter{margin-bottom:16px;color:#0864d7;font-size:12px;font-weight:900;letter-spacing:.15em}h2.ttl {margin-bottom: 32px; color: #122b4b; font-size: 40px; font-weight: 900; line-height: 1.5em; letter-spacing: -.04em; @media (max-width: 950px) {font-size: 36px;} @media (max-width: 750px) {font-size: 32px;} @media (max-width: 500px) {font-size: 28px;} @media (max-width: 400px) {font-size: 24px;}} .table {border-top: 1px solid #d5e1ed; .row {padding: 20px 4px; display: grid; grid-template-columns: 180px minmax(0,1fr); gap: 24px; border-bottom: 1px solid #d5e1ed; @media (max-width: 600px) {grid-template-columns: 1fr; gap: 6px;}} dt {color: #122b4b; font-size: 16px; font-weight: 900; line-height: 1.8em;} dd {color: #445771; font-size: 16px; line-height: 1.8em;}} .note {margin-top: 28px; padding: 20px 24px; background: #eef4fc; color: #1e3859; font-size: 15px; line-height: 1.8em; border-radius: 6px;} .btn_wrap {margin-top: 36px; @media (max-width: 500px) {a {width: 100%;}}}}.sec_brain_shokai{padding:104px 32px 96px;background:#0d326c;color:#fff;@media (max-width: 750px){padding:80px 24px 72px}@media (max-width: 500px){padding:64px 20px 56px}>.wrap{margin:0 auto;max-width:960px}.chapter{margin-bottom:16px;color:#a2caff;font-size:12px;font-weight:900;letter-spacing:.15em}h2.ttl {margin-bottom: 28px; color: #fff; font-size: 40px; font-weight: 900; line-height: 1.5em; letter-spacing: -.04em; @media (max-width: 950px) {font-size: 36px;} @media (max-width: 750px) {font-size: 32px;} @media (max-width: 500px) {font-size: 28px;} @media (max-width: 400px) {font-size: 24px;}} .text {color: #d3e2f7; font-size: 18px; line-height: 2em; @media (max-width: 500px) {font-size: 16px;}} .figure {margin: 48px 0 40px; padding: 36px 40px; display: grid; gap: 8px; background: #fff; color: #0b2247; border-radius: 10px; @media (max-width: 500px) {padding: 28px 24px;} .num {color: #0a63d8; font-size: 80px; font-weight: 900; line-height: 1.1em; letter-spacing: -.03em; @media (max-width: 750px) {font-size: 76px;} @media (max-width: 600px) {font-size: 72px;} @media (max-width: 500px) {font-size: 68px;} @media (max-width: 400px) {font-size: 64px;} span {margin-left: 6px; font-size: 32px; @media (max-width: 600px) {font-size: 28px;} @media (max-width: 400px) {font-size: 24px;}}} .cap {color: #445771; font-size: 16px; font-weight: 700; line-height: 1.7em;}} .table {border-top: 1px solid rgba(255,255,255,.24); .row {padding: 20px 4px; display: grid; grid-template-columns: 180px minmax(0,1fr); gap: 24px; border-bottom: 1px solid rgba(255,255,255,.24); @media (max-width: 600px) {grid-template-columns: 1fr; gap: 6px;}} dt {color: #fff; font-size: 16px; font-weight: 900; line-height: 1.8em;} dd {color: #d3e2f7; font-size: 16px; line-height: 1.8em;}}}.sec_brain_steps{padding:104px 32px 96px;background:#fdfcf9;color:#142a49;@media (max-width: 750px){padding:80px 24px 72px}@media (max-width: 500px){padding:64px 20px 56px}>.wrap{margin:0 auto;max-width:960px}.chapter{margin-bottom:16px;color:#0864d7;font-size:12px;font-weight:900;letter-spacing:.15em}h2.ttl {margin-bottom: 32px; color: #122b4b; font-size: 40px; font-weight: 900; line-height: 1.5em; letter-spacing: -.04em; @media (max-width: 950px) {font-size: 36px;} @media (max-width: 750px) {font-size: 32px;} @media (max-width: 500px) {font-size: 28px;} @media (max-width: 400px) {font-size: 24px;}} .list {display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 20px; @media (max-width: 750px) {grid-template-columns: 1fr; gap: 14px;} li {padding: 26px 24px; display: grid; align-content: start; gap: 10px; background: #fff; border: 1px solid #d5e1ed; border-radius: 8px;} .no {color: #0864d7; font-size: 14px; font-weight: 900; letter-spacing: .1em;} strong {color: #122b4b; font-size: 18px; font-weight: 900; line-height: 1.5em; .ib {display: inline-block;}} p {color: #445771; font-size: 15px; line-height: 1.8em;}} .sub_ttl {margin: 56px 0 20px; color: #122b4b; font-size: 24px; font-weight: 900; line-height: 1.5em; @media (max-width: 500px) {margin-top: 44px; font-size: 20px;}} .flow {display: grid; gap: 12px; li {padding-left: 18px; color: #445771; font-size: 16px; line-height: 1.8em; border-left: 3px solid #82b9ff;}}}.sec_brain_rules{padding:104px 32px 96px;background:#fff;color:#142a49;@media (max-width: 750px){padding:80px 24px 72px}@media (max-width: 500px){padding:64px 20px 56px}>.wrap{margin:0 auto;max-width:960px}.chapter{margin-bottom:16px;color:#0864d7;font-size:12px;font-weight:900;letter-spacing:.15em}h2.ttl {margin-bottom: 32px; color: #122b4b; font-size: 40px; font-weight: 900; line-height: 1.5em; letter-spacing: -.04em; @media (max-width: 950px) {font-size: 36px;} @media (max-width: 750px) {font-size: 32px;} @media (max-width: 500px) {font-size: 28px;} @media (max-width: 400px) {font-size: 24px;}} .list {display: grid; gap: 16px; li {padding: 22px 24px; display: grid; gap: 6px; background: #f7f9fc; border-left: 4px solid #0a63d8; border-radius: 0 6px 6px 0;} strong {color: #122b4b; font-size: 17px; font-weight: 900; line-height: 1.6em;} p {color: #445771; font-size: 15px; line-height: 1.8em;}}}.sec_brain_faq{padding:104px 32px 96px;background:#fdfcf9;color:#142a49;@media (max-width: 750px){padding:80px 24px 72px}@media (max-width: 500px){padding:64px 20px 56px}>.wrap{margin:0 auto;max-width:960px}.chapter{margin-bottom:16px;color:#0864d7;font-size:12px;font-weight:900;letter-spacing:.15em}h2.ttl {margin-bottom: 32px; color: #122b4b; font-size: 40px; font-weight: 900; line-height: 1.5em; letter-spacing: -.04em; @media (max-width: 950px) {font-size: 36px;} @media (max-width: 750px) {font-size: 32px;} @media (max-width: 500px) {font-size: 28px;} @media (max-width: 400px) {font-size: 24px;}} .list {border-top: 1px solid #d5e1ed; .item {padding: 22px 4px; display: grid; gap: 8px; border-bottom: 1px solid #d5e1ed;} dt {color: #122b4b; font-size: 17px; font-weight: 900; line-height: 1.6em;} dd {color: #445771; font-size: 16px; line-height: 1.8em; a {color: #0864d7; text-decoration: underline; text-underline-offset: 3px;}}} .checked {margin-top: 28px; color: #6b7c93; font-size: 13px; line-height: 1.8em;}}.sec_brain_closing{padding:72px 32px;background:#0a63d8;color:#fff;@media (max-width: 500px){padding:56px 20px}>.wrap{margin:0 auto;max-width:1320px;display:flex;align-items:center;justify-content:space-between;gap:36px;@media (max-width: 750px){flex-direction:column;align-items:start}}h2.ttl {color: #fff; font-size: 28px; font-weight: 900; line-height: 1.45em; @media (max-width: 500px) {font-size: 24px;}} p {margin-top: 10px; color: #d9e9ff; font-size: 15px; line-height: 1.8em;} .btn_ptn_1 { --color-btn-bg: #fff; --color-btn: #075fcf; @media (max-width: 500px) { width: 100%; } }}