/* 高校生の方へ｜10/5確認用 PC・SP 再構築。共通ヘッダー/ドロワー/フッターはkato-recruit-top.cssを継承 */
.krh{--krh-navy:#0b2545;--krh-orange:#e8651a;--krh-gray:rgba(11,37,69,.75);--krh-paper:#f4f7fa;color:var(--krh-navy);background:#fff}
.krh :is(h1,h2,h3,p,figure){margin:0}
.krh :is(h1,h2,h3){font-weight:700;color:inherit}
.krh-container{width:calc(100% - 160px);max-width:1320px;margin-inline:auto}
.krh-breadcrumb{display:flex;align-items:center;gap:12px;padding-top:128px;color:rgba(11,37,69,.55);font-size:12px;line-height:1.6;letter-spacing:.08em}
.krh-breadcrumb>span:last-child{color:rgba(11,37,69,.8)}
.krh-breadcrumb a:hover{color:var(--krh-orange)}
.krh-kicker{display:flex;align-items:center;gap:14px;color:var(--krh-orange);font:500 11px/1.6 Jost,sans-serif;letter-spacing:.32em;text-transform:uppercase}
.krh-kicker::before{content:"";display:block;flex:none;width:46px;height:2px;background:var(--krh-orange)}
.krh-hero{display:grid;grid-template-columns:46% 54%;align-items:stretch;padding-top:40px}
.krh-hero__copy{min-width:0;padding:46px 60px 60px max(80px,calc((100vw - 1320px)/2))}
.krh-hero h1{margin-top:22px;font-size:clamp(36px,3.65vw,52px);line-height:1.5;letter-spacing:.06em}
.krh-handline{display:block;width:220px;max-width:80%;height:14px;margin:8px 0 0 4px;color:var(--krh-orange)}
.krh-hero__lead{margin-top:30px!important;color:rgba(11,37,69,.72);font-size:18px;line-height:2;letter-spacing:.08em}
.krh-hero__visual{position:relative;min-width:0;height:380px;overflow:hidden;background:#e9eef4}
.krh-hero__visual img{width:100%;height:100%;object-fit:cover}
.krh-intro{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);align-items:start;gap:64px;padding-block:110px}
.krh-intro__title .krh-kicker{margin-bottom:20px}
.krh-intro__title h2{font-size:34px;line-height:1.6;letter-spacing:.06em}
.krh-intro__content{display:flex;flex-direction:column;gap:26px;padding-top:38px}
.krh-intro__content>p{color:rgba(11,37,69,.78);font-size:18px;line-height:2.15;letter-spacing:.06em}
.krh-intro__content .krh-intro__important{color:var(--krh-navy);font-size:18px;font-weight:700;line-height:2;letter-spacing:.06em}
.krh-intro__important span{background:linear-gradient(transparent 64%,rgba(232,101,26,.24) 64%);box-decoration-break:clone;-webkit-box-decoration-break:clone}
.krh-flow{background:var(--krh-paper);padding:110px 0 120px;scroll-margin-top:120px}
.krh-flow__heading{text-align:center;margin-bottom:60px}
.krh-flow__heading .krh-kicker{justify-content:center;margin-bottom:18px}
.krh-flow__heading h2{font-size:34px;line-height:1.5;letter-spacing:.06em}
.krh-flow__list{position:relative;display:flex;flex-direction:column;max-width:1040px;padding:20px 0 0;margin:0 auto;list-style:none;counter-reset:krh-step}
.krh-flow__list::before{content:"";position:absolute;left:calc(50% - 1px);top:48px;bottom:42px;width:2px;background:var(--krh-orange)}
.krh-step{position:relative;display:grid;grid-template-columns:minmax(0,1fr) 88px minmax(0,1fr);align-items:start;margin-top:-46px;min-width:0}
.krh-step:first-child{margin-top:0}
.krh-step__marker{position:relative;z-index:2;grid-column:2;grid-row:1;display:flex;justify-content:center;align-items:flex-start}
.krh-step__marker span{display:grid;place-items:center;width:52px;height:52px;border:1.5px solid var(--krh-navy);border-radius:50%;background:#fff;color:var(--krh-navy);font:500 18px/1 Jost,sans-serif}
.krh-step--last .krh-step__marker span{background:var(--krh-orange);border-color:var(--krh-orange);color:#fff}
.krh-step__card{position:relative;z-index:1;grid-column:1;grid-row:1;justify-self:end;max-width:420px;width:100%;min-width:0;padding:27px 30px 30px;background:#fff;border-radius:8px;box-shadow:0 7px 22px rgba(11,37,69,.07),0 2px 6px rgba(11,37,69,.035)}
.krh-step__card::after{content:"";position:absolute;top:25px;right:-18px;width:18px;height:2px;background:rgba(11,37,69,.32)}
.krh-step--right .krh-step__card{grid-column:3;justify-self:start}
.krh-step--right .krh-step__card::after{right:auto;left:-18px}
.krh-step__eyebrow{display:block;color:rgba(11,37,69,.42);font:500 10px/1.6 Jost,sans-serif;letter-spacing:.22em}
.krh-step__card h3{margin-top:8px;font-size:20px;line-height:1.7;letter-spacing:.065em}
.krh-step__caption{margin-top:6px!important;color:var(--krh-orange);font-size:16px;font-weight:700;line-height:1.9;letter-spacing:.055em}
.krh-step__description{margin-top:15px!important;color:var(--krh-gray);font-size:18px;line-height:2.15;letter-spacing:.065em}
.krh-step__description+.krh-step__description{margin-top:12px!important}
.krh-application{padding-top:110px}
.krh-application__box{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:64px;align-items:start;padding:48px 58px 52px;background:#fdf3ec;border-radius:8px}
.krh-application__title .krh-kicker{margin-bottom:17px}
.krh-application__title h2{font-size:28px;line-height:1.5;letter-spacing:.06em}
.krh-application__text{display:flex;flex-direction:column;gap:18px}
.krh-application__text p{font-size:18px;line-height:2.1;letter-spacing:.06em;color:rgba(11,37,69,.8)}
.krh-related{display:grid;grid-template-columns:1fr 1fr 1.1fr;gap:0;padding-top:90px;padding-bottom:120px}
.krh-related__link{display:flex;align-items:center;justify-content:space-between;min-width:0;min-height:120px;gap:20px;padding:32px 34px;border:1px solid rgba(11,37,69,.16);border-right:0;transition:color .25s ease,background .25s ease}
.krh-related__link:last-child{border-right:1px solid rgba(11,37,69,.16)}
.krh-related__link>span{display:flex;flex-direction:column;gap:10px}
.krh-related__link small{color:var(--krh-orange);font:500 10px/1.3 Jost,sans-serif;letter-spacing:.24em}
.krh-related__link strong{font-size:19px;line-height:1.5;letter-spacing:.1em}
.krh-related__link>i{width:30px;height:1px;background:currentColor;flex:none;transition:width .25s ease}
.krh .krh-related__link--dark{background:var(--krh-navy);color:#fff}
.krh-related__link--dark small{color:rgba(255,255,255,.82)}
.krh .krh-related__link:is(:hover,:focus-visible){background:var(--krh-navy);color:#fff}
.krh .krh-related__link--dark:is(:hover,:focus-visible){background:var(--krh-orange);color:#fff}
.krh-related__link:is(:hover,:focus-visible)>i{width:45px}
@media(max-width:1279px){
 .krh-container{width:calc(100% - 96px)}
 .krh-hero__copy{padding-left:48px;padding-right:35px}
 .krh-intro{gap:42px}
 .krh-application__box{gap:42px}
 .krh-related__link{padding-inline:24px}
}
@media(max-width:1028px){
 .krh-container{width:calc(100% - 72px)}
 .krh-hero__copy{padding-left:36px}
 .krh-hero h1{font-size:40px}
 .krh-hero__visual{height:345px}
 .krh-intro__title h2{font-size:29px}
 .krh-step__card{padding:22px 24px 25px}
 .krh-step__card h3{font-size:18px}
 .krh-step__description{font-size:16px}
 .krh-application__box{padding:38px 34px}
 .krh-related__link{padding-inline:16px;gap:12px}
 .krh-related__link strong{font-size:18px}
}
@media(max-width:767px){
 .krh-container{width:calc(100% - 44px);max-width:520px}
 .krh-breadcrumb{padding-top:84px;gap:10px;font-size:11px}
 .krh-kicker{font-size:10px;letter-spacing:.28em;gap:10px}
 .krh-kicker::before{width:32px}
 .krh-hero{display:flex;flex-direction:column;padding-top:30px}
 .krh-hero__copy{padding:0 22px 32px}
 .krh-hero h1{font-size:34px;margin-top:16px;line-height:1.5}
 .krh-handline{width:160px;height:12px;margin:6px 0 0 2px}
 .krh-hero__lead{font-size:15px;letter-spacing:.06em;margin-top:20px!important;line-height:2}
 .krh-hero__visual{height:230px;flex:none}
 .krh-hero__visual img{object-position:var(--krh-position-sp,55% 40%)!important}
 .krh-intro{display:flex;flex-direction:column;gap:22px;padding-top:56px;padding-bottom:60px}
 .krh-intro__title .krh-kicker{margin-bottom:16px}
 .krh-intro__title h2{font-size:22px;line-height:1.6;letter-spacing:.05em}
 .krh-intro__content{gap:22px;padding-top:0}
 .krh-intro__content>p{font-size:16px;line-height:2;letter-spacing:.04em}
 .krh-intro__content .krh-intro__important{font-size:18px;line-height:2}
 .krh-intro__content br{display:none}
 .krh-flow{padding:60px 0 64px;scroll-margin-top:70px}
 .krh-flow__heading{margin-bottom:36px}
 .krh-flow__heading .krh-kicker{margin-bottom:14px}
 .krh-flow__heading h2{font-size:22px;letter-spacing:.05em}
 .krh-flow__list{padding-top:0;gap:14px}
 .krh-flow__list::before{left:21px;top:20px;bottom:35px}
 .krh-step,.krh-step:first-child{display:grid;grid-template-columns:44px minmax(0,1fr);column-gap:16px;margin-top:0;min-width:0}
 .krh-step__marker{grid-column:1;grid-row:1;justify-content:flex-start}
 .krh-step__marker span{width:44px;height:44px;font-size:18px}
 .krh-step__card,.krh-step--right .krh-step__card{grid-column:2;grid-row:1;justify-self:stretch;width:100%;max-width:none;border:0;border-radius:8px;background:#fff;padding:18px 17px 22px;box-shadow:0 5px 16px rgba(11,37,69,.055),0 1px 4px rgba(11,37,69,.025)}
 .krh-step__card::after,.krh-step--right .krh-step__card::after{display:none}
 .krh-step__card h3{font-size:17px;margin-top:7px;line-height:1.7;letter-spacing:.06em}
 .krh-step__caption{font-size:15px;line-height:1.9;margin-top:5px!important}
 .krh-step__description{font-size:16px;letter-spacing:.045em;margin-top:14px!important;line-height:2.1}
 .krh-step__description+.krh-step__description{margin-top:12px!important}
 .krh-step--last .krh-step__card{padding-bottom:22px}
 .krh-application{padding-top:56px}
 .krh-application__box{display:block;padding:30px 22px 32px}
 .krh-application__title .krh-kicker{margin-bottom:12px}
 .krh-application__title h2{font-size:20px;line-height:1.5}
 .krh-application__text{gap:12px;margin-top:18px}
 .krh-application__text p{font-size:16px;line-height:2.05;letter-spacing:.04em}
 .krh-application__text br{display:none}
 .krh-related{display:flex;flex-direction:column;gap:0;padding-top:48px;padding-bottom:64px}
 .krh-related__link{min-height:76px;padding:18px 22px;border:1px solid rgba(11,37,69,.16);border-bottom:0}
 .krh-related__link:last-child{border-bottom:1px solid rgba(11,37,69,.16)}
 .krh-related__link>span{gap:6px}
 .krh-related__link small{font-size:10px;letter-spacing:.22em}
 .krh-related__link strong{font-size:18px;letter-spacing:.08em}
 .krh-related__link>i{width:26px}
}
@media(max-width:359px){.krh-hero h1{font-size:30px}.krh-intro__title h2{font-size:20px}.krh-step__card h3{font-size:18px}.krh-step__card,.krh-step--right .krh-step__card{padding-inline:14px}}
@media(prefers-reduced-motion:reduce){.krh *{scroll-behavior:auto!important;transition:none!important}}

/* 2026-10-30: left-aligned contact link inside APPLICATION. */
.krh .krh-application__text > .krh-application__contact {
  align-self: flex-start; max-width: 100%; white-space: normal;
  margin-top: 7px; gap: 18px; font-size: 16px; color: inherit; text-align: left;
}
.krh .krh-application__contact .krt-link-symbol {
  flex-shrink: 0; background: currentColor;
}
.krh .krh-application__contact:is(:hover,:focus-visible) { color: var(--krh-orange); }
.krh .krh-application__contact:focus-visible { outline: 2px solid currentColor; outline-offset: 5px; }
@media (max-width: 767px) {
  .krh .krh-application__text > .krh-application__contact { font-size: 15px; margin-top: 9px; gap: 12px; }
}
