@charset "utf-8";
/* ============================================================
   KECの強み ページ（案A：グリッド・カード型）
   既存サイトに合わせてライト固定。全セレクタを .kec-strength にスコープ
   ============================================================ */
.kec-strength{
  --navy:#164a84; --navy-d:#0f3663; --ink:#1c2530; --body:#39434f; --sub:#5a6675;
  --line:#e4e9f0; --panel:#f4f7fb; --mark:#ffe08a;
  color:var(--body);
  font-family:"Noto Sans JP","Yu Gothic",YuGothic,"Hiragino Kaku Gothic ProN","Meiryo",sans-serif;
  line-height:1.95; font-size:15.5px;
  -webkit-font-smoothing:antialiased;
}
.kec-strength *{box-sizing:border-box;}

/* ---- hero ---- */
.kec-strength .ks-hero{
  background:linear-gradient(120deg,#0d2f57,#164a84 58%,#1f5aa0);
  color:#fff; padding:64px 24px 56px; position:relative; overflow:hidden;
}
.kec-strength .ks-hero::after{content:"";position:absolute;right:-70px;top:-70px;width:320px;height:320px;border:1px solid rgba(255,255,255,.13);border-radius:50%;}
.kec-strength .ks-hero::before{content:"";position:absolute;right:40px;bottom:-110px;width:230px;height:230px;border:1px solid rgba(255,255,255,.09);border-radius:50%;}
.kec-strength .ks-hero-in{max-width:1000px;margin:0 auto;position:relative;z-index:2;}
.kec-strength .ks-hero .eb{font-size:12px;letter-spacing:.34em;opacity:.85;margin:0 0 16px;font-weight:700;}
.kec-strength .ks-hero h1{font-size:clamp(27px,4.4vw,44px);line-height:1.28;margin:0 0 18px;font-weight:800;}
.kec-strength .ks-hero .ks-lead-hero{margin:0;max-width:60ch;opacity:.94;font-size:15.5px;}
.kec-strength .ks-stats{display:flex;gap:34px;flex-wrap:wrap;margin:28px 0 0;padding:22px 0 0;border-top:1px solid rgba(255,255,255,.18);}
.kec-strength .ks-stats div{display:flex;flex-direction:column;}
.kec-strength .ks-stats .n{font-size:30px;font-weight:800;line-height:1;font-family:"Helvetica Neue",Arial,sans-serif;letter-spacing:-.01em;}
.kec-strength .ks-stats .n small{font-size:.5em;font-weight:700;margin-left:3px;opacity:.9;}
.kec-strength .ks-stats .l{font-size:12px;opacity:.82;margin-top:7px;letter-spacing:.02em;}

/* ---- body wrapper ---- */
.kec-strength .ks-body{max-width:1000px;margin:0 auto;padding:0 24px 20px;}

/* ---- section ---- */
.kec-strength .ks-sec{padding:52px 0;border-bottom:1px solid var(--line);}
.kec-strength .ks-sec:last-of-type{border-bottom:none;}
.kec-strength .ks-head{display:flex;align-items:flex-start;gap:20px;margin:0 0 22px;}
.kec-strength .ks-head .idx{font-size:46px;font-weight:800;color:var(--navy);line-height:.9;opacity:.26;font-family:"Helvetica Neue",Arial,sans-serif;letter-spacing:-.03em;flex:none;}
.kec-strength .ks-head .kw{font-size:13px;color:var(--navy);font-weight:700;letter-spacing:.04em;margin:0 0 4px;}
.kec-strength .ks-head h2{margin:0;font-size:clamp(21px,3vw,27px);font-weight:800;color:var(--ink);line-height:1.35;}

.kec-strength .ks-grid{display:grid;grid-template-columns:1fr 320px;gap:36px;align-items:start;}
.kec-strength .lead{margin:0 0 16px;color:var(--body);}
.kec-strength .lead mark,
.kec-strength .p mark{background:linear-gradient(transparent 58%,var(--mark) 58%);color:inherit;padding:0 1px;font-weight:600;}
.kec-strength .points{list-style:none;margin:0 0 18px;padding:0;display:flex;flex-direction:column;gap:9px;}
.kec-strength .points li{position:relative;padding-left:26px;color:var(--ink);font-weight:600;font-size:14.5px;}
.kec-strength .points li::before{content:"";position:absolute;left:2px;top:.62em;width:9px;height:9px;border-radius:2px;background:var(--navy);transform:rotate(45deg);}
.kec-strength .p{margin:0 0 15px;color:var(--body);}
.kec-strength .p:last-child{margin-bottom:0;}
.kec-strength .p strong{color:var(--navy-d);font-weight:700;}

/* ---- aside (photo + spec) ---- */
.kec-strength .ks-aside{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:22px;}
.kec-strength .ks-aside .vt{height:150px;border-radius:10px;background:#fff;border:1px solid var(--line);overflow:hidden;margin:0 0 16px;}
.kec-strength .ks-aside .vt img{width:100%;height:100%;object-fit:cover;display:block;}
.kec-strength .ks-aside h3{margin:0 0 10px;font-size:13px;letter-spacing:.06em;color:var(--navy);font-weight:800;}
.kec-strength .ks-aside dl{margin:0;display:grid;grid-template-columns:auto 1fr;gap:7px 12px;font-size:13px;}
.kec-strength .ks-aside dt{color:var(--sub);white-space:nowrap;}
.kec-strength .ks-aside dd{margin:0;color:var(--ink);font-weight:700;text-align:right;}

/* ---- cta ---- */
.kec-strength .ks-cta{margin:44px 0 20px;background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:30px 32px;display:flex;justify-content:space-between;align-items:center;gap:22px;flex-wrap:wrap;}
.kec-strength .ks-cta .t b{display:block;font-size:17px;color:var(--ink);font-weight:800;margin-bottom:4px;}
.kec-strength .ks-cta .t span{font-size:13.5px;color:var(--sub);}
.kec-strength .ks-cta a{background:var(--navy);color:#fff;text-decoration:none;padding:14px 28px;border-radius:9px;font-weight:800;font-size:14.5px;white-space:nowrap;transition:transform .2s;}
.kec-strength .ks-cta a:hover{transform:translateY(-2px);}

@media (max-width:760px){
  .kec-strength .ks-hero{padding:48px 22px 40px;}
  .kec-strength .ks-body{padding-left:22px;padding-right:22px;}
  .kec-strength .ks-grid{grid-template-columns:1fr;gap:22px;}
  .kec-strength .ks-aside{order:-1;}
  .kec-strength .ks-head .idx{font-size:36px;}
}

/* ============================================================
   固定ナビ(#top-link)が hero に被らないための制御（デスクトップのみ）
   - hero表示中(body.ks-hero-lock): ホバー展開・ドロップダウンを抑止し細いバーのまま
   - hero通過後(body.ks-nav-solid): バーを不透明な濃紺にして白背景でも視認性を確保
   ============================================================ */
@media screen and (min-width:961px){
  #top-link ul{transition:background-color .3s ease, box-shadow .3s ease;}
  /* hero表示中：展開・サブメニューを無効化 */
  body.ks-hero-lock #top-link ul:hover a{height:2.5em;padding-top:.5em;}
  body.ks-hero-lock #top-link a:hover span{display:none;}
  body.ks-hero-lock #top-link .has-dropdown:hover>.dropdown-menu,
  body.ks-hero-lock #top-link .has-dropdown>a[aria-expanded="true"]+.dropdown-menu{opacity:0;visibility:hidden;transform:translateY(-5px);}
  body.ks-hero-lock #top-link .dropdown-submenu{opacity:0!important;visibility:hidden!important;}
  /* hero通過後：不透明な濃紺バー */
  body.ks-nav-solid #top-link ul{background:#0e3057;box-shadow:0 2px 10px rgba(0,0,0,.18);}
}