@charset "utf-8";

/* Scope layout adjustments to /abouts/sogo. */
.controller-abouts.action-sogo .contentsRs2,
.controller-abouts.action-sogo .pContentsRes2 { max-width: none; }
.controller-abouts.action-sogo { min-width: 320px; }
.controller-abouts.action-sogo .headerInner { min-width: 320px; }
.controller-abouts.action-sogo .footer { min-width: 0; }
.controller-abouts.action-sogo .headerNaviSp,
.controller-abouts.action-sogo .headerBtmNavi { display: none; }
.controller-abouts.action-sogo .headerNavi:not(.headerNaviSp):not(.headerBtmNavi) { display: block; }
.controller-abouts.action-sogo .headerNavi:not(.headerNaviSp):not(.headerBtmNavi) > li:not(:nth-last-child(-n+2)) { display: none; }
.sogoLp { --lp-blue: #166eb8; --lp-pale: #f2f7fb; color: #313131; font-family: "Noto Sans JP", "Yu Gothic", Meiryo, sans-serif; font-size: 16px; line-height: 1.5; overflow: clip; }
.sogoLp h1, .sogoLp h2, .sogoLp h3, .sogoLp p, .sogoLp figure, .sogoLp ul, .sogoLp ol { margin: 0; padding: 0; }
.sogoLp h1, .sogoLp h2, .sogoLp h3 { border: 0; background: none; line-height: 1.4; }
.sogoLp img { display: block; }
.sogoLp em { color: var(--lp-blue); font-style: normal; font-weight: 700; }
.sogoLp strong, .sogoLpRibbon, .sogoLpNeeds h3 { font-family: "Noto Serif JP", "Yu Mincho", "Hiragino Mincho ProN", serif; }
.sogoLp .sogoLpHeading { color: var(--lp-blue); font-size: 24px; text-align: center; }
.sogoLpHeading strong { font-size: 32px; }
.sogoLpHeading small { display: block; font-size: 22px; }
.sogoLpSp { display: none; }
.sogoLp a:focus-visible { outline: 3px solid #eaa82b; outline-offset: 5px; }

/* First view: the lecturer group keeps the supplied image's aspect ratio. */
.sogoLpHero { background: linear-gradient(100deg, #166eb8, #264587); color: #fff; position: relative; overflow: hidden; }
.sogoLpHeroInner { max-width: 1280px; height: 438px; margin: auto; position: relative; }
.sogoLpHeroPattern { position: absolute; inset: 0; opacity: .18; pointer-events: none; }
.sogoLpHeroPattern img { position: absolute; top: -35px; left: calc(50% - 500px); transform: scale(1.6); }
.sogoLpHeroPattern img:nth-child(2) { top: -59px; left: calc(50% - 522px); }
.sogoLpHeroPattern img:nth-child(3) { left: calc(50% - 548px); }
.sogoLpHeroPattern img:nth-child(4) { top: 2px; left: calc(50% - 422px); }
.sogoLpHeroPattern img:nth-child(5) { top: -59px; left: calc(50% - 522px); }
.sogoLpHeroPattern img:nth-child(6) { top: -59px; }
.sogoLpHeroCopy { position: relative; z-index: 2; padding-top: 55px; margin-left: 6.25%; width: 650px; }
.sogoLpHeroQuestion { position: relative; display: inline-block; padding: 5px 16px 10px !important; border: 1px solid transparent; font-size: 18px; font-weight: 700; margin-bottom: 14px !important; }
.sogoLpHeroQuestionFrame { position: absolute; left: -1px; top: -1px; width: calc(100% + 2px); height: calc(100% + 10px); overflow: visible; pointer-events: none; }
.sogoLpHeroLead { font-size: 28px; font-weight: 700; }
.sogoLpHero h1 { position: relative; display: table; color: #fff; font-family: "Noto Serif JP", "Yu Mincho", serif; font-size: 44px; white-space: nowrap; padding-bottom: 5px; }
.sogoLpHero h1::after { content: ""; position: absolute; bottom: 0; left: 0; width: 100%; height: 1px; background: linear-gradient(90deg, #fff0, #fff 50%, #fff0); }
.sogoLpHero h1 span { font-size: .7em; }
.sogoLpHero h1 small { font-size: .75em; }
.sogoLpAchievements { display: flex; gap: 8px; margin: 24px 0; }
.sogoLpAchievements p { position: relative; flex: 0 0 156px; height: 70px; font-family: "Noto Serif JP", "Yu Mincho", serif; font-weight: 700; font-size: 13px; line-height: 1.4; text-align: center; padding: 12px 18px; white-space: nowrap; }
.sogoLpAchievements p::before, .sogoLpAchievements p::after { content: ""; position: absolute; top: 0; bottom: 0; width: 28px; background: linear-gradient(90deg,#b37e10,#f8dd7b,#b37e10); mask-repeat: no-repeat; mask-size: contain; mask-position: center; }
.sogoLpAchievements p::before { left: 0; mask-image: url('../img/sogo_lp/1-1644-Rectangle1541.svg'); transform: scaleX(-1); }
.sogoLpAchievements p::after { right: 0; mask-image: url('../img/sogo_lp/1-1644-Rectangle1540.svg'); }
.sogoLpAchievements strong { font-size: 18px; }
.sogoLpAchievements small { display: block; width: 100%; font-size: 12px; }
.sogoLpCta { display: inline-flex; align-items: center; justify-content: center; gap: 8px; background: #fff; color: var(--lp-blue); border-radius: 100px; padding: 10px 14px; font-weight: 700; box-shadow: 0 3px 2px #0002; text-decoration: none; }
.sogoLpCta:hover { opacity: .85; color: var(--lp-blue); }
.sogoLpCta img:last-child { margin-left: 8px; }
.sogoLpHeroTeachers { position: absolute; bottom: 0; right: 0; width: 50.78125%; overflow: hidden; }
.sogoLpHeroTeachers img { width: 100%; height: auto; }
.sogoLpBreadcrumb { padding: 10px 20px; font-size: 10px; color: #ed916e; }
.sogoLpBreadcrumb a { color: inherit; }
.sogoLpBreadcrumb span { margin: 0 12px; }

/* Definition and the nine-step diagram. */
.sogoLpIntro { padding: 40px 20px; }
.sogoLpIntroTitleLine, .sogoLpMismatchTitleLine { display: inline-block; position: relative; padding-bottom: 8px; }
.sogoLpIntroTitleLine::after, .sogoLpMismatchTitleLine::after, .sogoLpPlanningResult h3 strong::after { content: ""; position: absolute; bottom: 0; left: 0; width: 100%; height: 1px; background: linear-gradient(90deg, #166eb800, var(--lp-blue) 50%, #166eb800); }
.sogoLpDefinition { max-width: 800px; margin: 40px auto 10px; display: flex; align-items: center; justify-content: space-between; gap: 40px; }
.sogoLpDefinitionCopy { max-width: 465px; flex: 1; }
.sogoLpDefinitionCopy h3 { border-left: 3px solid var(--lp-blue); padding-left: 12px; color: var(--lp-blue); font-family: "Noto Serif JP", "Yu Mincho", serif; margin-bottom: 32px; }
.sogoLpDefinitionCopy h3 small { display: block; font-size: 22px; padding-bottom: 12px; }
.sogoLpDefinitionCopy h3 span { display: inline-block; background: var(--lp-blue); color: white; width: 40px; font-size: 28px; text-align: center; border: 1px solid white; }
.sogoLpDefinitionCopy p + p { margin-top: 16px; }
.sogoLpDefinitionCopy em { font-size: 20px; }
.sogoLpConcept { position: relative; width: 295.105px; height: 291.609px; flex: 0 0 295.105px; text-align: center; }
/* Keep the SVG and its labels in the same coordinate system on every screen. */
.sogoLpConceptBackground { position: absolute; left: -6px; top: 8px; width: 307.105px; height: 283.609px; max-width: none; }
.sogoLpConceptPart { position: absolute; display: flex; flex-direction: column; align-items: center; gap: 6px; white-space: nowrap; transform: translateX(-50%); }
.sogoLpConceptPart--basics { left: 149.138px; top: 34px; width: 166px; }
.sogoLpConceptPart--understanding { left: 76.085px; top: 165px; width: 120px; }
.sogoLpConceptPart--exam { left: 219.02px; top: 165px; width: 115px; }
.sogoLpConceptPart p { font-size: 16px; line-height: 1.3; }
.sogoLpConceptPart b { color: var(--lp-blue); }
.sogoLpConceptPart small { font-size: 8px; line-height: 1.3; }
.sogoLpConceptIcon { display: flex; align-items: center; justify-content: center; background: white; width: 35px; height: 35px; border-radius: 50%; position: relative; }
.sogoLpConceptCenter { position: absolute; top: 129px; left: 113.999px; width: 71.071px; height: 71.071px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px; color: white; font-size: 12px; line-height: 1.4; white-space: nowrap; }
.sogoLpConceptCenter img { width: 26.904px; height: 24.901px; }
.sogoLpConceptExamIcon img { position: absolute; }
.sogoLpConceptExamIcon img:nth-child(1) { left: 10px; top: 7px; }
.sogoLpConceptExamIcon img:nth-child(2) { left: 9px; top: 7px; }
.sogoLpConceptExamIcon img:nth-child(3) { left: 11px; top: 9px; }
.sogoLpConceptExamIcon img:nth-child(4) { left: 12px; top: 15px; }
.sogoLpConceptExamIcon img:nth-child(5) { left: 12px; top: 18px; }
.sogoLpConceptExamIcon img:nth-child(6) { left: 12px; top: 21px; }
.sogoLpConceptExamIcon img:nth-child(7) { left: 17px; top: 17px; }
.sogoLpSteps { width: 958px; max-width: 100%; height: 406px; margin: auto; position: relative; background: #f7f7f7; border-radius: 2px; }
.sogoLpSteps h3 { padding: 24px 0; color: var(--lp-blue); font-size: 18px; text-align: center; }
.sogoLpStep { position: absolute; left: calc(49px + var(--step) * 63px); bottom: calc(35px + var(--step) * 32px); height: 32px; margin: 0; }
.sogoLpSteps ol { list-style: none; }
.sogoLpStep picture { display: block; }
.sogoLpStep picture img { max-width: none; }
.sogoLpStep b { position: absolute; left: calc(223px - var(--step) * 22px); top: 50%; transform: translateY(-50%); font-size: 13px; line-height: 1.4; white-space: nowrap; color: #000; -webkit-text-stroke: 2px #fff; paint-order: stroke fill; }
.sogoLpStepNumber { position: absolute; left: calc(181px - var(--step) * 22px); bottom: 8px; width: 34px; height: 34px; display: flex; flex-direction: column; justify-content: center; align-items: center; border: 2px solid var(--step-color); border-radius: 50%; background: white; color: var(--step-color); font: italic bold 16px/1 Arial,sans-serif; }
.sogoLpStepNumber small { font-size: 8px; line-height: 1.2; }
.sogoLpStep--1 { --step: 0; --step-color: #6df1fe; }
.sogoLpStep--2 { --step: 1; --step-color: #5edbf3; }
.sogoLpStep--3 { --step: 2; --step-color: #55caef; }
.sogoLpStep--4 { --step: 3; --step-color: #52bbed; }
.sogoLpStep--5 { --step: 4; --step-color: #529fe6; }
.sogoLpStep--6 { --step: 5; --step-color: #538ee0; }
.sogoLpStep--7 { --step: 6; --step-color: #4a79e2; }
.sogoLpStep--8 { --step: 7; --step-color: #376bc7; }
.sogoLpStep--9 { --step: 8; --step-color: #166eb8; }
.sogoLpStepLevels p { position: absolute; left: 162px; top: 80px; width: 397px; display: flex; align-items: center; font-size: 14px; font-weight: 700; white-space: nowrap; }
.sogoLpStepLevels p::after { content: ''; flex: 1; margin-left: 6px; border-top: 2px solid #166eb8; }
.sogoLpStepLevels p:nth-child(2) { top: 111px; }
.sogoLpStepLevels p:nth-child(2) { width: 356px; }
.sogoLpStepLevels p:nth-child(3) { top: 176px; width: 274px; }
.sogoLpStepLevels p:nth-child(4) { top: 208px; width: 233px; }
.sogoLpIntroConclusion { text-align: center; margin: 24px auto 0; }
.sogoLpIntroConclusion p + p { margin-top: 16px; font-weight: 700; }
.sogoLpIntroConclusion b { color: var(--lp-blue); font-size: 22px; }

/* Why a single curriculum cannot serve every learner. */
.sogoLpMismatch { padding: 40px 20px; background: var(--lp-pale); }
.sogoLpMismatchGrid { display: flex; align-items: center; justify-content: center; gap: 40px; margin: 40px auto 0; max-width: 953px; }
.sogoLpMismatchPhotos { width: 481px; height: 421px; position: relative; flex: 0 0 481px; }
.sogoLpMismatchPhotos div { position: absolute; width: 263px; height: 373px; filter: drop-shadow(8px 14px 0 #ced5df); }
.sogoLpMismatchPhotos div:first-child { left: 0; top: 31px; }
.sogoLpMismatchPhotos div:last-child { right: 9px; top: 0; }
.sogoLpMismatchPhotos img { width: 100%; height: 100%; object-fit: cover; clip-path: polygon(38% 0,100% 0,62% 100%,0 100%); }
.sogoLpMismatchPhotos div:first-child img { object-position: 56% center; }
.sogoLpMismatchPhotos div:last-child img { transform: scaleX(-1); clip-path: polygon(0 0,62% 0,100% 100%,38% 100%); object-position: 45% center; }
.sogoLpMismatchCopy { flex: 1; font-size: 16px; }
.sogoLpMismatchCopy p { margin-top: 24px; }
.sogoLpMismatchCopy em { font-size: 22px; }
.sogoLpMismatchUnderline { display: inline-block; padding-bottom: 4px; border-bottom: 2px dotted #99c6e9; }
.sogoLpRibbon { display: table; position: relative; isolation: isolate; color: white; padding: 6px 24px !important; font-size: 24px; }
.sogoLpRibbon::before { content: ''; position: absolute; inset: 0; transform: skewX(-15deg); background: var(--lp-blue); z-index: -1; }
.sogoLpQuestion { padding: 40px 20px; margin-bottom: 80px; text-align: center; position: relative; background: linear-gradient(var(--lp-pale), #f7f7f7); }
.sogoLpQuestion h2 { font-size: 20px; color: #313131; }
.sogoLpQuestion h2 strong { display: block; margin-top: 4px; color: var(--lp-blue); font-family: inherit; font-size: 28px; }
.sogoLpQuestion p { margin-top: 24px; }
.sogoLpQuestion em { font-size: 20px; }
.sogoLpQuestion h2 em { font-size: inherit; text-emphasis: filled dot; text-emphasis-position: over; }
.sogoLpQuestionTip { position: absolute; top: 100%; left: 0; width: 100%; height: 80px; background: url('../img/sogo_lp/1-762-Polygon20.svg') center / 100% 100% no-repeat; transform: scaleY(-1); }
.sogoLpDifferences { max-width: 1280px; margin: auto; padding: 24px 80px 60px; }
.sogoLpDifferences > h2 { margin: 0 auto 24px; }
.sogoLpRibbon strong { font-size: 40px; line-height: 1; }
.sogoLpDifferencesGrid { display: grid; grid-template-columns: 1fr 1fr; gap: 40px; }
.sogoLpDifferencesGrid li { padding: 26px 16px 26px 24px; display: flex; gap: 24px; align-items: center; border-bottom: 1px dashed #ccc; }
.sogoLpDifferencesGrid li p { font-size: 22px; font-weight: 700; white-space: nowrap; }
.sogoLpDifferencesGrid li em { font-size: 32px; font-family: "Noto Serif JP", "Yu Mincho", serif; text-emphasis: filled dot; text-emphasis-position: over; }
.sogoLpCircleIcon { flex: 0 0 40px; width: 40px; height: 40px; display: flex; align-items: center; justify-content: center; border-radius: 50%; background: var(--lp-blue); }
.sogoLpWritingPhoto { overflow: hidden; aspect-ratio: 450 / 272; }
.sogoLpWritingPhoto img { width: 100%; height: 113.33%; object-fit: cover; object-position: top; }
.sogoLpDifferencesConclusion { font-size: 18px; text-align: center; font-weight: 700; margin-top: 40px !important; }
.sogoLpPhotoBand { position: relative; height: 240px; display: grid; place-items: center; color: white; }
.sogoLpPhotoBandImages { position: absolute; inset: 0; overflow: hidden; }
.sogoLpPhotoBandImages img { width: 100%; height: 100%; object-fit: cover; }
.sogoLpPhotoBand h2 { position: relative; color: #fff; font-family: "Noto Serif JP", "Yu Mincho", serif; font-size: 28px; text-align: center; text-shadow: 0 2px 1px #0004; }

/* Planning, instructor portraits and closing statement. */
.sogoLpPlanning { background: var(--lp-blue); padding: 40px max(20px, calc((100% - 1120px) / 2)) 60px; }
.sogoLpPlanningLead { position: relative; max-width: 859px; min-height: 338px; margin: 0 auto 24px; color: white; }
.sogoLpPlanningCopy { position: relative; width: 730px; max-width: 100%; margin-left: -100px; padding-top: 5px; z-index: 2; text-align: center; }
.sogoLpPlanningCopy p { max-width: 530px; margin-inline: auto; line-height: 1.65; }
.sogoLpPlanningCopy p b:first-child { font-size: 20px; }
.sogoLpPlanningCopy h2 { color: #fff; margin-top: 24px; border-block: 1px solid #ffffff50; padding: 28px 0; font: bold 32px/1.5 "Noto Serif JP", "Yu Mincho", serif; white-space: nowrap; background: linear-gradient(90deg,transparent,#ffffff15,transparent); }
.sogoLpPlanningCopy h2 small { display: block; margin-bottom: 12px; font-size: 24px; }
.sogoLpIto { position: absolute; left: 530px; top: -140px; width: 409px; height: 504px; }
.sogoLpIto > div { position: relative; width: 320px; height: 515px; overflow: hidden; }
.sogoLpIto img { position: absolute; width: 141.33%; height: auto; left: -14.35%; top: -7.43%; max-width: none; }
.sogoLpIto figcaption { position: absolute; right: 0; bottom: 28px; font-family: "Noto Serif JP", "Yu Mincho", serif; font-weight: 700; }
.sogoLpIto small { font-size: 12px; }
.sogoLpPlanningCard { position: relative; background: white; border-radius: 2px; box-shadow: 0 2px 4px #0002; padding-top: 40px; overflow: hidden; }
.sogoLpNeeds { display: grid; grid-template-columns: 1fr 1fr; gap: 40px; align-items: center; padding: 0 24px; }
.sogoLpNeedsPhoto { aspect-ratio: 540 / 361; overflow: hidden; }
.sogoLpNeedsPhoto img { width: 100%; height: 102.49%; object-fit: cover; transform: scaleX(-1); }
.sogoLpNeeds h3 { border-left: 3px solid var(--lp-blue); padding-left: 16px; font-size: 24px; color: var(--lp-blue); margin-bottom: 24px; }
.sogoLpNeedsCopy p + p { margin-top: 24px; }
.sogoLpAxes { --axis-gap: 28px; display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: var(--axis-gap); margin: 72px 24px 40px; }
.sogoLpAxis { position: relative; background: var(--lp-pale); padding: 24px 16px 8px; box-shadow: 2px 3px 3px #0002; font-weight: 700; }
.sogoLpAxis + .sogoLpAxis::before { content: '×'; position: absolute; left: calc(var(--axis-gap) / -2); top: 50%; transform: translate(-50%, -50%); width: 24px; height: 24px; text-align: center; font-size: 24px; line-height: 1; color: var(--lp-blue); }
.sogoLpAxis h3 { display: flex; align-items: center; gap: 4px; width: max-content; max-width: 100%; position: absolute; top: 0; left: 50%; transform: translate(-50%, -80%); background: var(--lp-blue); color: white; font-family: "Noto Serif JP", "Yu Mincho", "Hiragino Mincho ProN", serif; font-size: 18px; line-height: 22px; padding: 4px 8px; border-radius: 2px; white-space: nowrap; }
.sogoLpAxis h3::after { content: ''; position: absolute; top: 100%; left: calc(50% - 5px); border-top: 5px solid var(--lp-blue); border-inline: 5px solid transparent; }
.sogoLpAxis h3 img { flex-shrink: 0; width: 16px; height: 16px; box-sizing: content-box; padding: 3px; background: white; border-radius: 50%; }
.sogoLpAxis li { background: white; padding: 8px; display: flex; align-items: center; gap: 8px; font-size: 15px; min-height: 40px; margin-bottom: 8px; }
.sogoLpAxis li img { flex-shrink: 0; box-sizing: content-box; padding: 6px; background: var(--lp-pale); border-radius: 50%; }
.sogoLpAxis > p { text-align: center; font: 16px/1 Arial, sans-serif; }
.sogoLpPlanningResult { position: relative; min-height: 330px; padding: 35px 16px 24px; text-align: center; isolation: isolate; }
.sogoLpResultArrow { position: absolute; top: -31px; left: calc(50% - 21.5px); }
.sogoLpResultImages { position: absolute; inset: 0; z-index: -1; display: flex; justify-content: space-between; overflow: hidden; }
.sogoLpResultImages::after { content: ''; position: absolute; inset: 0; background: linear-gradient(90deg, transparent, #fff9 25%,white 40%,white 60%,#fff9 75%,transparent); }
.sogoLpResultImages img { width: 36%; object-fit: cover; object-position: center; }
.sogoLpPlanningResult h3 small { display: block; font-size: 18px; }
.sogoLpPlanningResult h3 strong { position: relative; display: inline-block; color: var(--lp-blue); font-size: 40px; padding: 8px 0; margin-bottom: 8px; }
.sogoLpPlanningResult > p { display: table; position: relative; color: white; font-size: 18px; font-weight: 700; margin: 28px auto 0; padding: 18px 60px; background: linear-gradient(90deg,transparent,#166eb8f2 15%,#166eb8 50%,#166eb8e6 85%,transparent); }
.sogoLpPlanningResult > p strong { display: block; font-size: 30px; }
.sogoLpTeachers { padding: 60px 20px; background: var(--lp-pale); text-align: center; }
.sogoLpTeachers > p { margin-top: 24px; }
.sogoLpTeacherGrid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 24px; max-width: 940px; margin: 40px auto; }
.sogoLpTeacherPortrait { width: 212px; max-width: 100%; margin: auto; }
.sogoLpTeacherPortrait img { width: 100%; height: auto; }
.sogoLpTeacher figcaption { margin-top: 8px; font-weight: 700; line-height: 1.4; }
.sogoLpTeacher strong { color: var(--lp-blue); font-size: 18px; }
.sogoLpTeacher small { font-size: 14px; }
.sogoLpTeachers .sogoLpTeacherConclusion { margin-top: 8px; color: var(--lp-blue); font: bold 20px/1.5 "Noto Serif JP", "Yu Mincho", serif; }
.sogoLpPromise { position: relative; background: var(--lp-pale); height: 533px; padding: 0 20px; }
.sogoLpPromisePhotos { position: absolute; bottom: 0; left: 0; width: 100%; height: 300px; display: flex; }
.sogoLpPromisePhotos img { width: 33.333%; height: 100%; object-fit: cover; }
.sogoLpPromisePhotos::after { content: ''; position: absolute; inset: 0; background: #0004; }
.sogoLpPromiseCard { position: relative; max-width: 958px; margin: auto; padding: 8px; background: white; box-shadow: 0 3px 6px 2px #0002; }
.sogoLpPromiseCard > div { border: 1.5px solid var(--lp-blue); padding: 40px 20px 45px; text-align: center; }
.sogoLpPromiseCard p { font-size: 18px; }
.sogoLpPromiseCard h2 { margin-top: 24px; color: var(--lp-blue); font: bold 32px/1.4 "Noto Serif JP", "Yu Mincho", serif; }
.sogoLpPromiseCard strong { position: relative; display: table; border-bottom: 1px dashed var(--lp-blue); margin: auto; font-size: 40px; }
.sogoLpPromiseCard strong::before, .sogoLpPromiseCard strong::after { position: absolute; top: 0; font-size: .8em; line-height: 1; }
.sogoLpPromiseCard strong::before { content: '“'; right: calc(100% + .25em); }
.sogoLpPromiseCard strong::after { content: '”'; left: calc(100% + .25em); }
.sogoLpCourses { background: var(--lp-pale); padding: 60px 0; scroll-margin-top: 24px; }
.sogoLpCourses > p { text-align: center; margin: 24px 20px 40px; }
.sogoLpCourses .topSogoCourseList { margin-top: 40px; }
.sogoLpCourses .sogoLpCoursesEmpty { padding: 40px 20px; }

@media (min-width: 1101px) and (max-width: 1279px) {
    .sogoLpHero h1 { font-size: 40px; }
    .sogoLpHeroLead { font-size: 26px; }
    .sogoLpAchievements p { flex-basis: 128px; font-size: 11px; padding-inline: 10px; }
    .sogoLpAchievements strong { font-size: 14px; }
    .sogoLpAchievements small { font-size: 10px; }
    .sogoLpAchievements p::before, .sogoLpAchievements p::after { width: 20px; }
}

@media (min-width: 768px) and (max-width: 1100px) {
    .sogoLpHeroInner { height: 665px; }
    .sogoLpHeroCopy { padding-top: 32px; margin: auto; width: 650px; text-align: center; }
    .sogoLpHero h1 { margin: auto; }
    .sogoLpAchievements { gap: 8px; }
    .sogoLpAchievements p { flex-basis: 158px; font-size: 13px; }
    .sogoLpAchievements strong { font-size: 18px; }
    .sogoLpHeroTeachers { width: 600px; height: 290px; right: calc(50% - 300px); }
    .sogoLpDefinition { gap: 24px; }
    .sogoLpSteps { zoom: .76; }
    .sogoLpMismatchGrid { gap: 20px; }
    .sogoLpMismatchPhotos { zoom: .75; }
    .sogoLpDifferences { padding-inline: 24px; }
    .sogoLpDifferencesGrid { gap: 20px; }
    .sogoLpDifferencesGrid li { padding: 20px 0; gap: 12px; }
    .sogoLpDifferencesGrid li p { font-size: 16px; }
    .sogoLpDifferencesGrid li em { font-size: 24px; }
    .sogoLpPlanningCopy { width: 80%; margin-left: 0; }
    .sogoLpPlanningCopy h2 { font-size: clamp(20px, 2.5vw, 28px); }
    .sogoLpPlanningCopy h2 small { font-size: 19px; }
    .sogoLpPlanningCopy p b:first-child { font-size: 16px; }
    .sogoLpIto { left: 62%; width: 38%; top: -80px; height: 442px; }
    .sogoLpIto > div { width: 260px; height: 442px; }
    .sogoLpNeeds { gap: 24px; }
    .sogoLpAxes { --axis-gap: 20px; margin-inline: 16px; }
    .sogoLpAxis { padding-inline: 8px; }
    .sogoLpAxis h3 { font-size: 15px; }
    .sogoLpAxis li { font-size: 12px; padding-inline: 4px; gap: 4px; }
    .sogoLpTeacherPortrait { zoom: .8; }
}

@media (max-width: 767px) {
    .sogoLp { font-size: 15px; }
    .sogoLpPc { display: none !important; }
    .sogoLpSp { display: initial; }
    .sogoLp .sogoLpHeading { font-size: 18px; }
    .sogoLpHeading small { font-size: 16px; }
    .sogoLpHeading strong { font-size: 23px; }
    .sogoLpHeroInner { height: 553px; }
    .sogoLpHeroCopy { width: 100%; padding: 38px 12px 0; margin: 0; text-align: center; }
    .sogoLpHeroQuestion { font-size: 15px; padding: 5px 8px 10px !important; margin-bottom: 8px !important; }
    .sogoLpHeroLead { font-size: 18px; }
    .sogoLpHero h1 { font-size: 31px; margin: 4px auto 0; }
    .sogoLpAchievements { display: grid; grid-template-columns: 146px 146px; justify-content: center; gap: 4px; margin: 16px 0; }
    .sogoLpAchievements p { height: 53px; font-size: 12px; padding: 8px 15px; }
    .sogoLpAchievements strong { font-size: 17px; }
    .sogoLpAchievements p:first-child strong { font-size: 20px; }
    .sogoLpAchievements small { font-size: 10px; }
    .sogoLpAchievements p::before, .sogoLpAchievements p::after { width: 21px; }
    .sogoLpCta { font-size: 15px; padding: 10px 12px; }
    .sogoLpHeroTeachers { width: 114%; max-width: 444px; height: 210px; right: 50%; transform: translateX(50%); }
    .sogoLpBreadcrumb { display: none; }
    .sogoLpIntro { padding: 40px 20px; }
    .sogoLpIntro > h2 { font-size: 15px !important; margin-inline: -10px; }
    .sogoLpDefinition { flex-direction: column; margin-top: 24px; gap: 24px; }
    .sogoLpDefinitionCopy { max-width: 100%; }
    .sogoLpDefinitionCopy h3 { margin-bottom: 24px; }
    .sogoLpDefinitionCopy h3 small { font-size: 16px; }
    .sogoLpDefinitionCopy h3 span { width: 32px; font-size: 22px; }
    .sogoLpDefinitionCopy em { font-size: 18px; }
    .sogoLpConcept { flex-basis: 291.609px; margin: 0 auto 18px; transform: scale(1.1); }
    .sogoLpSteps { width: 350px; height: 440px; margin-top: 16px; }
    .sogoLpSteps h3 { font-size: 16px; padding: 24px 0; }
    .sogoLpStep { left: calc(29px + var(--step) * 12.42px); bottom: calc(24px + var(--step) * 38px); height: 38px; }
    .sogoLpStep b { left: 25px; font-size: 12px; }
    .sogoLpStepNumber { left: -7px; bottom: 6px; width: 24px; height: 24px; border-width: 1px; font-size: 12px; }
    .sogoLpStepNumber small { font-size: 8px; }
    .sogoLpStepLevels p { display: block; left: 6px; width: 65px; top: 77px; font-size: 11px; line-height: 1.2; white-space: normal; }
    .sogoLpStepLevels p span { display: block; }
    .sogoLpStepLevels p::after { position: absolute; top: 50%; width: 55px; left: 55px; margin: 0; border-top-width: 1px; }
    .sogoLpStepLevels p:nth-child(2) { top: 115px; width: 65px; }
    .sogoLpStepLevels p:nth-child(2)::after { width: 43px; }
    .sogoLpStepLevels p:nth-child(3) { top: 193px; width: 65px; }
    .sogoLpStepLevels p:nth-child(3)::after { width: 18px; left: 64px; }
    .sogoLpStepLevels p:nth-child(4) { top: 231px; width: 65px; }
    .sogoLpStepLevels p:nth-child(4)::after { width: 18px; }
    .sogoLpIntroConclusion { margin-top: 24px; text-align: left; }
    .sogoLpIntroConclusion p + p { text-align: center; }
    .sogoLpIntroConclusion b { font-size: 22px; }
    .sogoLpMismatch { padding: 40px 20px; }
    .sogoLpMismatchGrid { flex-direction: column; gap: 16px; margin-top: 24px; }
    .sogoLpMismatchPhotos { zoom: .678; flex-basis: 421px; }
    .sogoLpMismatchCopy { text-align: center; font-size: 15px; }
    .sogoLpMismatchCopy .sogoLpRibbon { margin: auto; }
    .sogoLpMismatchCopy p { margin-top: 16px; }
    .sogoLpMismatchCopy em { font-size: 20px; }
    .sogoLpMismatchCopy p:last-child { text-align: left; }
    .sogoLpRibbon { font-size: 22px; padding: 6px 16px !important; }
    .sogoLpQuestion { padding: 24px 20px; margin-bottom: 40px; }
    .sogoLpQuestionTip { height: 40px; }
    .sogoLpQuestion h2 { font-size: 16px; }
    .sogoLpQuestion h2 strong { font-size: 22px; line-height: 1.5; margin-top: 12px; }
    .sogoLpQuestion p { font-size: 14px; margin-top: 16px; }
    .sogoLpQuestion em { font-size: 18px; }
    .sogoLpDifferences { padding: 24px 20px 40px; }
    .sogoLpDifferencesGrid { display: flex; flex-direction: column; gap: 24px; }
    .sogoLpDifferencesGrid li { padding: 12px; gap: 14px; }
    .sogoLpDifferencesGrid li p { font-size: 16px; }
    .sogoLpDifferencesGrid li em { font-size: 24px; }
    .sogoLpCircleIcon { width: 32px; height: 32px; flex-basis: 32px; }
    .sogoLpDifferencesConclusion { margin-top: 24px !important; font-size: 15px; text-align: left; }
    .sogoLpPhotoBand { height: 250px; }
    .sogoLpPhotoBand h2 { font-size: 22px; }
    .sogoLpPlanning { padding: 32px 20px 40px; }
    .sogoLpPlanningLead { display: flex; flex-direction: column; min-height: 0; margin-bottom: 0; }
    .sogoLpPlanningCopy { width: 100%; margin-left: 0; }
    .sogoLpPlanningCopy p { font-size: 14px; }
    .sogoLpPlanningCopy p b:first-child { font-size: 15px; }
    .sogoLpPlanningCopy h2 { font-size: 26px; padding: 24px 0; white-space: normal; }
    .sogoLpPlanningCopy h2 small { font-size: 18px; }
    .sogoLpPlanningLead .sogoLpIto { position: relative; top: auto; left: auto; width: 222px; height: 231px; margin: 10px auto 0; }
    .sogoLpIto > div { height: 231px; width: 187px; }
    .sogoLpIto figcaption { font-size: 13px; right: 0; bottom: 28px; }
    .sogoLpPlanningCard { padding-top: 12px; }
    .sogoLpNeeds { display: flex; flex-direction: column; gap: 24px; padding: 0 12px; }
    .sogoLpNeedsPhoto { width: 100%; }
    .sogoLpNeeds h3 { font-size: 19px; padding-left: 8px; margin-bottom: 16px; }
    .sogoLpNeedsCopy p + p { margin-top: 16px; }
    .sogoLpAxes { --axis-gap: 64px; grid-template-columns: 1fr; margin: 48px 16px 40px; }
    .sogoLpAxis + .sogoLpAxis::before { left: 50%; top: calc(var(--axis-gap) / -2 - 8px); }
    .sogoLpAxis { padding: 24px 12px 8px; }
    .sogoLpAxis h3 { font-size: 16px; }
    .sogoLpAxis li { font-size: 13px; }
    .sogoLpPlanningResult { min-height: 320px; padding: 32px 8px 16px; }
    .sogoLpResultImages img { width: 50%; }
    .sogoLpResultImages::after { background: linear-gradient(90deg,#ffffff50,#ffffffe6 35%,#ffffffe6 65%,#ffffff50); }
    .sogoLpPlanningResult h3 small { font-size: 14px; }
    .sogoLpPlanningResult h3 strong { max-width: 270px; font-size: 24px; }
    .sogoLpPlanningResult > p { padding: 16px 8px; font-size: 14px; }
    .sogoLpPlanningResult > p strong { font-size: 26px; }
    .sogoLpTeachers { padding: 40px 20px; }
    .sogoLpTeachers > p { font-size: 14px; margin-top: 16px; }
    .sogoLpTeacherGrid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 24px 16px; margin: 32px auto; max-width: 400px; }
    .sogoLpTeacherPortrait { zoom: .835; }
    .sogoLpTeacher figcaption { font-size: 15px; }
    .sogoLpTeacher strong { font-size: 16px; }
    .sogoLpTeacher small { font-size: 12px; }
    .sogoLpTeachers .sogoLpTeacherConclusion { font-size: 18px; }
    .sogoLpPromise { height: 402px; }
    .sogoLpPromisePhotos { height: 190px; }
    .sogoLpPromiseCard > div { padding: 24px 12px; }
    .sogoLpPromiseCard p { font-size: 14px; }
    .sogoLpPromiseCard h2 { font-size: 20px; }
    .sogoLpPromiseCard strong { font-size: 25px; }
    .sogoLpCourses { padding: 40px 0; }
}
@media (max-width: 374px) {
    .sogoLpConcept { transform: scale(.95); }
    .sogoLpHero h1 { font-size: 26px; }
    .sogoLpIntro > h2 strong { font-size: 20px; }
    .sogoLpSteps { zoom: .8; max-width: none; }
    .sogoLpMismatchPhotos { zoom: .58; }
    .sogoLpDifferencesGrid li { padding-inline: 0; gap: 8px; }
    .sogoLpDifferencesGrid li p { font-size: 14px; }
    .sogoLpDifferencesGrid li em { font-size: 21px; }
    .sogoLpTeacherPortrait { zoom: .65; }
}