/* TOP information architecture and spacing pass — candidate R3 / 2026-09-03 */
/* A2-4：Webフォント差し替え（FOUT）の跳ねを抑えるOswald代替面（2026-09-04）。
   size-adjustは概算値。390pxでの高さ差の実測は未実施（デザイン指示書§7参照） */
@font-face{font-family:"Oswald Fallback";src:local("Arial Narrow"),local("Helvetica Neue");size-adjust:88%;ascent-override:95%}
/* A5：--ux-navy/--ux-blue/--ux-pink/--ux-yellow/--ux-lineはindex.htmlの--kgl-*に統一（値は変えない）。
   --ux-text(#242936)は--kgl-text(#262626)と値が違うため据え置き。
   B1（2026-09-04）：--ux-surfaceは.p-work/.home--pickup/.media-secが--kgl-surface(#E8EDFB)か#fffに移行し、
   参照元が無くなったため削除（値そのものは変えていない） */
:root{
  --ux-text:#242936;
}

.u-visually-hidden{
  position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;
  overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important;
}
.fv-html__catch{margin:0}

/* Selection remains directly below the FV. B2（2026-09-04）で.ux-heading系は廃止し、型A（.mdl--content-title）に統一 */
.ux-selection-top{padding:30px 0 34px!important}

/* Consistent section rhythm. */
/* B1（2026-09-04）：白3連続の区切りに使っていた罫線を削除。地色の差で区切るため不要（色差の帯に一本化） */
.profile-sec{padding:36px 0!important;background:#fff!important}
/* B10（2026-09-04）：program-status.json R3-12の台帳値（36px desktop/24px mobile）を正とし、
   index.htmlにあった重複定義（旧:57-63）を削除してここへ1本化。.results-secも他8セクションに揃えた */
.results-sec{padding:36px 0!important}
/* B1：WHY KASHIMAの地色を薄灰(--ux-surface)から薄青(--kgl-surface)へ（帯を白/薄青の2色に統一） */
.p-work{background:var(--kgl-surface)!important}
.p-work__inner{max-width:1188px!important;padding:36px 20px!important}
.p-work__wrap{max-width:1148px!important}
.p-work__head{
  width:100%;
  max-width:none;
  margin:0 auto;
  display:block!important;
  text-align:left;
}
.p-work__head .mdl--content-title{width:100%;max-width:none;padding:0!important;margin:0 0 22px!important}
.p-work__head .mdl--content-title,.p-work__head .mdl--content-title--en,.p-work__head .jp-pink{text-align:left!important}
.p-work__title{width:100%;max-width:none;margin:-8px 0 6px!important;font-size:15px!important;line-height:1.7!important;font-weight:700!important;letter-spacing:.02em!important;color:var(--kgl-deep)!important;text-align:left!important}
.p-work__description{width:100%;max-width:none;margin:0 0 20px!important;font-size:13.5px!important;line-height:1.9!important;color:#4a5163!important;text-align:left!important}
.p-work__main{margin-top:0!important}
.p-work__list{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.p-work__item{margin:0!important;min-width:0}
.p-work__item-img{aspect-ratio:4/3!important}
.p-work__item-title-inner{left:9px!important;bottom:9px!important;font-size:15px!important;line-height:1.55!important;letter-spacing:.03em!important}
.p-work__item-title-inner span{padding:1px 7px!important}
/* B7-6（2026-09-04）：.p-work__item-num は本体側で削除済み */

.ux-section{padding:36px 0;background:#fff}
.ux-feature-grid{max-width:900px;margin:0 auto;padding:0 20px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.ux-feature-card{display:block;min-width:0;background:#fff;color:inherit;text-decoration:none;border:1px solid var(--kgl-border);border-radius:var(--kgl-radius-card);overflow:hidden;transition:transform .2s,box-shadow .2s,border-color .2s}
.ux-feature-card:hover{transform:translateY(-2px);border-color:var(--kgl-blue);box-shadow:var(--kgl-shadow-hover);color:inherit}
.ux-feature-card:focus-visible{outline:3px solid rgba(255,213,0,.8);outline-offset:3px}
.ux-feature-card>img{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:cover}
.ux-feature-card__body{display:block;padding:16px 18px 18px}
.ux-feature-card__body i{display:block;margin-bottom:4px;font-family:'Oswald','Oswald Fallback',sans-serif;font-size:11px;font-style:normal;font-weight:700;letter-spacing:.15em;color:var(--kgl-deep)}
.ux-feature-card__body b{display:block;font-size:16px;line-height:1.6;color:var(--kgl-deep)}
.ux-feature-card__body small{display:block;margin-top:6px;font-size:12.5px;line-height:1.8;color:#5a6172}
.ux-section-action{text-align:center;margin:20px 0 0}

.tiles2-sec{padding:36px 0!important;background:#e8edfb!important}
.ux-team-tiles{max-width:900px!important;padding:0 20px!important;display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:18px!important}
.ux-team-tiles .ptile{min-width:0;border-radius:var(--kgl-radius-card)!important;overflow:hidden}
.ux-team-tiles .ptile>img{aspect-ratio:16/9;object-fit:cover}
.team-nav{max-width:900px!important;grid-template-columns:repeat(3,minmax(0,1fr))!important}

/* B1：NEWSの地色を白から薄青(--kgl-surface)へ（RESULTS白→NEWS薄青→PROFILE白の交互リズム） */
.home--pickup{background:var(--kgl-surface)!important}
.home--pickup .container-md{padding-top:36px!important;padding-bottom:36px!important;margin-bottom:0!important}

/* B1：MEDIAの地色を薄灰(--ux-surface)から白へ（TEAM薄青→MEDIA白→GOODS薄青の交互リズム） */
.media-sec{padding:36px 0!important;background:#fff!important}
.ux-media-grid{max-width:940px;margin:0 auto;padding:0 20px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px;align-items:start}
.ux-media-grid .media-block{min-width:0;margin:0!important}
.ux-media-grid .media-sub{padding:0!important;margin-bottom:12px!important}
.ux-media-grid .movie-grid--single,.ux-media-grid .ig-card{max-width:none!important;padding:0!important}
.ux-media-grid .movie-foot{margin-top:12px}
.ux-media-grid .ig-head{
  padding:12px!important;
  display:grid!important;
  grid-template-columns:44px minmax(0,1fr) auto!important;
  align-items:center!important;
  gap:10px!important;
}
.ux-media-grid .ig-avatar{grid-column:1;grid-row:1}
.ux-media-grid .ig-id{grid-column:2;grid-row:1;min-width:0}
.ux-media-grid .ig-id b{font-size:clamp(11px,2.6vw,14px);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ux-media-grid .ig-id i{font-size:11px;line-height:1.45}
.ux-media-grid .ig-follow{
  grid-column:3!important;
  grid-row:1!important;
  justify-self:end!important;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:40px;
  padding:0 12px!important;
  font-size:11px!important;
}
.ux-media-grid .ig-grid{gap:2px}
.media-block--timez{max-width:720px;margin:24px auto 0!important}
.media-block--timez .media-sub{max-width:720px;padding:0!important;margin:0 0 12px!important}
.media-block--timez .sec-banner{max-width:720px!important;padding:0!important;margin:0!important}

.goods-strip{padding:36px 0!important}
.goods-strip__act .kbtn--gold,.cta-close .kbtn-gold{white-space:nowrap}
.partner-sec{padding:36px 0!important}
.partner-sec .pbox-list{max-width:900px!important;margin:0 auto!important;padding:0 20px!important;display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:14px!important}
.partner-sec .pbox{
  width:auto!important;
  min-width:0!important;
  min-height:0!important;
  margin:0!important;
  padding:0!important;
  aspect-ratio:3/1!important;
  overflow:hidden;
}
.partner-sec .pbox img{
  inset:10px!important;
  width:calc(100% - 20px)!important;
  height:calc(100% - 20px)!important;
  padding:0!important;
  object-fit:contain!important;
  object-position:center!important;
  transform:none!important;
}
.partner-sec .pbox--text{
  display:flex!important;
  align-items:center;
  justify-content:center;
  padding:6px!important;
  font-size:clamp(11px,1.35vw,18px)!important;
  line-height:1.35;
  text-align:center;
  letter-spacing:.01em!important;
  white-space:nowrap;
  word-break:keep-all;
  overflow-wrap:normal;
  font-feature-settings:"palt";
}

@media (max-width:768px){
  .sh-in{padding-left:12px!important;padding-right:12px!important;gap:6px!important}
  .sh-brand{min-width:0;flex:1 1 auto;gap:8px!important}
  .sh-brand img{flex:0 0 auto}
  .sh-names{min-width:0;flex:1 1 auto;line-height:1.25!important}
  .sh-names b,.sh-names i{display:block!important;max-width:none!important;white-space:nowrap!important;word-break:keep-all!important;overflow-wrap:normal!important}
  .sh-names b{font-size:clamp(8px,2.6vw,11px)!important;letter-spacing:-.02em!important}
  .sh-names i{font-size:clamp(7px,2.1vw,9px)!important;letter-spacing:.08em!important}
  .sh-nav{flex:0 0 auto;gap:4px!important}
  .sh-cart,.hamburger{margin-left:0!important}
  .ux-selection-top{padding:20px 0 22px!important}
  .results-sec,.profile-sec,.ux-section,.tiles2-sec,.media-sec,.goods-strip,.partner-sec{padding-top:24px!important;padding-bottom:24px!important}
  .p-work__inner{padding:24px 16px!important}
  .p-work__head .mdl--content-title{margin-bottom:18px!important}
  .p-work__title{margin:0 0 6px!important;font-size:15px!important;line-height:1.65!important}
  .p-work__description{margin:0 0 18px!important;font-size:13px!important;line-height:1.8!important}
  .p-work__list{grid-template-columns:1fr;gap:14px}
  .p-work__item-img{aspect-ratio:16/9!important}
  .ux-feature-grid,.ux-team-tiles,.ux-media-grid{padding:0 16px!important;grid-template-columns:1fr!important;gap:14px!important}
  .ux-feature-card__body{padding:14px 15px 16px}
  .ux-feature-card__body b{font-size:15px}
  .team-nav{grid-template-columns:1fr!important}
  .home--pickup .container-md{padding-top:24px!important;padding-bottom:24px!important}
  .media-block--timez{margin-top:20px!important;padding:0 16px}
  .media-block--timez .media-sub,.media-block--timez .sec-banner{max-width:none!important}
  .goods-strip__act .kbtn--gold,.cta-close .kbtn-gold{
    width:auto!important;
    min-width:0!important;
    max-width:calc(100% - 32px)!important;
    min-height:48px!important;
    padding:0 22px!important;
    font-size:13px!important;
    line-height:1!important;
  }
  .partner-sec .pbox-list{padding:0 16px!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px!important}
  .partner-sec .pbox{min-height:0!important;padding:0!important}
  .partner-sec .pbox img{inset:6px!important;width:calc(100% - 12px)!important;height:calc(100% - 12px)!important}
  .partner-sec .pbox--text{padding:4px!important;font-size:clamp(11px,2.7vw,13px)!important}
}
/* B3（2026-09-04）：ヘッダー校名の英字行（8px前後）は同じ画面のFV・フッターに出るため非表示に。
   和名は11px未満(clamp下限8px→390pxで10.14px)にならないよう12pxへ固定 */
@media(max-width:600px){
  .sh-names i{display:none!important}
  .sh-names b{font-size:12px!important}
}

@media (max-width:360px){
  .ux-team-tiles .ptile__body b{font-size:13px}
  .ux-media-grid .ig-head{grid-template-columns:40px minmax(0,1fr) auto!important;padding:10px!important;gap:8px!important}
  .ux-media-grid .ig-avatar{width:40px;height:40px}
  .ux-media-grid .ig-id b{font-size:11px}
  .ux-media-grid .ig-id i{display:none}
  .ux-media-grid .ig-follow{min-height:38px;padding:0 9px!important;font-size:11px!important}
  .goods-strip__act .kbtn--gold,.cta-close .kbtn-gold{min-height:46px!important;padding-inline:16px!important;font-size:12px!important}
  .partner-sec .pbox-list{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:8px!important}
}
