@charset "UTF-8";

/* ======================================================================
   K&Partners lower pages / kpunder-v1.css v008
   TYPE HERO stable foundation

   前提:
   1. TOP完成版の kpfirst.css / kprest.css を先に読み込む。
   2. ヘッダーとフッターの骨格はTOP共通CSSへ任せる。
   3. このCSSは下層本文と、下層だけの追加UIのみを担当する。
   4. 1個目のCMSブロック＝最大1920pxのヒーロー。
   5. 2個目以降＝最大1200pxの本文。
   ====================================================================== */

/* ===== 001: lower-page foundation ===== */
body#top.kp-under-v1 {
  min-width: 0 !important;
  margin: 0 !important;
  overflow-x: clip;
  color: #1d2f46;
  background: #fff;
}

body#top.kp-under-v1,
body#top.kp-under-v1 * {
  box-sizing: border-box;
}

body#top.kp-under-v1 .kp-under-page {
  width: 100%;
  min-width: 0;
  margin: 0;
  padding: 50px 0 0;
  background: #fff;
}

body#top.kp-under-v1 main#main.kp-under-main {
  display: block !important;
  float: none !important;
  clear: both !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 0 96px !important;
  overflow: visible !important;
  background: #fff !important;
}

body#top.kp-under-v1 .kp-under-wide-container {
  width: min(1200px, calc(100% - 48px));
  min-width: 0;
  margin-inline: auto;
}

/* ===== 002: breadcrumb ===== */
body#top.kp-under-v1 .kp-under-context-band {
  position: relative;
  z-index: 70;
  width: 100%;
  min-width: 0;
  background: #f4f7fb;
  border-top: 1px solid rgba(18, 59, 117, .06);
  border-bottom: 1px solid #dce5ef;
}

body#top.kp-under-v1 .kp-under-breadcrumb {
  width: 100%;
  min-width: 0;
  margin: 0;
  padding: 0;
}

body#top.kp-under-v1 .kp-under-breadcrumb ol {
  display: flex;
  align-items: center;
  flex-wrap: nowrap;
  gap: 7px;
  min-height: 34px;
  margin: 0;
  padding: 7px 0;
  overflow: hidden;
  list-style: none;
}

body#top.kp-under-v1 .kp-under-breadcrumb li {
  display: inline-flex;
  align-items: center;
  min-width: 0;
  margin: 0;
  padding: 0;
  color: #60728a;
  font-size: 11px;
  line-height: 1.45;
  white-space: nowrap;
}

body#top.kp-under-v1 .kp-under-breadcrumb li:last-child {
  flex: 1 1 auto;
  overflow: hidden;
  text-overflow: ellipsis;
}

body#top.kp-under-v1 .kp-under-breadcrumb a {
  color: #315d99;
  text-decoration: none;
}

body#top.kp-under-v1 .kp-under-breadcrumb a:hover,
body#top.kp-under-v1 .kp-under-breadcrumb a:focus-visible {
  color: #123b75;
  text-decoration: underline;
  text-underline-offset: 3px;
}

body#top.kp-under-v1 .kp-under-breadcrumb li > span[aria-hidden="true"] {
  flex: 0 0 auto;
  margin-left: 7px;
  color: #91a0b2;
  font-size: 14px;
  line-height: 1;
}

/* ===== 003: CMS block output ===== */
body#top.kp-under-v1 .kp-under-content {
  display: block;
  width: 100%;
  min-width: 0;
  margin: 0;
  padding: 0;
}

body#top.kp-under-v1 .kp-under-block.block {
  display: block;
  float: none !important;
  clear: both !important;
  min-width: 0;
  max-width: none;
  border: 0;
}

/* 1個目: ページ固有ヒーロー。1200px本文コンテナには入れない。 */
body#top.kp-under-v1 .kp-under-block--hero {
  width: 100% !important;
  max-width: 1920px !important;
  margin: 0 auto !important;
  padding: 0 !important;
  overflow: hidden;
}

body#top.kp-under-v1 .kp-under-block--hero > .kp-under-heading {
  display: none !important;
}

body#top.kp-under-v1 .kp-under-block--hero > .kp-under-body {
  width: 100% !important;
  min-width: 0;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

body#top.kp-under-v1 .kp-under-block--hero img,
body#top.kp-under-v1 .kp-under-block--hero picture,
body#top.kp-under-v1 .kp-under-block--hero video {
  max-width: 100%;
  height: auto;
}

/*
 * CMS内で1920pxや固定heightを直接指定しても、画面幅に応じて縮む共通フレーム。
 * 内容が多い場合はmin-heightを超えて自然に伸びる。
 */
body#top.kp-under-v1 .kp-under-hero-frame {
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  height: auto !important;
  min-height: clamp(460px, 36vw, 620px);
  margin: 0 auto !important;
  overflow: hidden;
}

body#top.kp-under-v1 .kp-under-hero-frame h1 {
  max-width: min(92%, 1120px);
  font-size: clamp(38px, 4.25vw, 68px) !important;
  line-height: 1.14 !important;
  overflow-wrap: anywhere;
}

@media screen and (max-width: 1440px) {
  body#top.kp-under-v1 .kp-under-hero-frame {
    min-height: clamp(420px, 38vw, 520px);
  }

  body#top.kp-under-v1 .kp-under-hero-frame h1 {
    font-size: clamp(34px, 4vw, 56px) !important;
  }
}

/* 2個目以降: 実DOM上の専用1200px safety。標準は1カラム。 */
body#top.kp-under-v1 .kp-under-content__safety {
  display: block;
  width: min(1200px, calc(100% - 64px)) !important;
  min-width: 0 !important;
  max-width: 1200px !important;
  margin-right: auto !important;
  margin-left: auto !important;
  padding: 0 !important;
}

body#top.kp-under-v1 .kp-under-content__safety > .kp-under-block {
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  margin-right: 0 !important;
  margin-left: 0 !important;
  padding-right: 0 !important;
  padding-left: 0 !important;
}

/* CMS本文側に古い固定幅や100vwが残っていても、1200pxの外へ出さない。 */
body#top.kp-under-v1 .kp-under-content__safety > .kp-under-block > .kp-under-body {
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  margin-right: 0 !important;
  margin-left: 0 !important;
  padding-right: 0 !important;
  padding-left: 0 !important;
  overflow-x: clip;
}

body#top.kp-under-v1 .kp-under-content__safety > .kp-under-block > .kp-under-body > * {
  max-width: 100% !important;
  box-sizing: border-box !important;
}

/*
 * JavaScriptが止まった場合の安全策。
 * kpUnderContent直下にブロックが残っていても、2個目以降は1200pxへ収める。
 */
body#top.kp-under-v1 .kp-under-content > .kp-under-block:nth-child(n + 2) {
  width: min(1200px, calc(100% - 64px)) !important;
  min-width: 0 !important;
  max-width: 1200px !important;
  margin-right: auto !important;
  margin-left: auto !important;
  padding-right: 0 !important;
  padding-left: 0 !important;
}

body#top.kp-under-v1 .kp-under-content > .kp-under-block:nth-child(n + 2) > .kp-under-body {
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  margin-right: 0 !important;
  margin-left: 0 !important;
  padding-right: 0 !important;
  padding-left: 0 !important;
  overflow-x: clip;
}

body#top.kp-under-v1 .kp-under-content > .kp-under-block:nth-child(n + 2) > .kp-under-body > *,
body#top.kp-under-v1 .kp-under-content__safety > .kp-under-block > .kp-under-body > * {
  max-width: 100% !important;
  margin-right: 0 !important;
  margin-left: 0 !important;
  box-sizing: border-box !important;
}

/* 通常のCMS見出しあり */
body#top.kp-under-v1 .kp-under-block--default-heading {
  padding-top: 56px !important;
}

/* CMS見出しなし＋本文先頭に自作H2
   共通見出し用に予約していた余白はゼロ。自作H2自身の余白だけを使う。 */
body#top.kp-under-v1 .kp-under-block--custom-heading {
  padding-top: 0 !important;
}

/* CMS見出しなし＋本文先頭にもH2なし
   空のタイトル領域を完全に詰め、本文HTML側の余白だけを使う。 */
body#top.kp-under-v1 .kp-under-block--no-heading {
  padding-top: 0 !important;
}

/* ヒーロー直後は、main側とブロック側の余白を重ねない。 */
body#top.kp-under-v1 .kp-under-block--first-content.kp-under-block--default-heading {
  padding-top: 48px !important;
}

body#top.kp-under-v1 .kp-under-block--first-content.kp-under-block--custom-heading,
body#top.kp-under-v1 .kp-under-block--first-content.kp-under-block--no-heading {
  padding-top: 0 !important;
}

/* CMSが生成した実質空要素を、余白源にしない。 */
body#top.kp-under-v1 .kp-cms-empty {
  display: none !important;
  width: 0 !important;
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* ===== 004: common CMS headings ===== */
/*
 * 共通の丸装飾はH2だけに限定する。
 * テンプレートJSがH3〜H6へ .kp-under-heading を付けても、
 * 下のリセットによってH2と同じ大見出しにはならない。
 */
body#top.kp-under-v1 h2.kp-under-heading {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  width: 100%;
  min-height: 30px;
  margin: 0 0 24px !important;
  padding: 0 0 0 15px !important;
  color: #082b67 !important;
  background: transparent !important;
  border: 0 !important;
  font-size: clamp(20px, 1.28vw, 24px) !important;
  font-weight: 800 !important;
  line-height: 1.35 !important;
  letter-spacing: -.02em;
  overflow-wrap: anywhere;
}

body#top.kp-under-v1 h2.kp-under-heading::before {
  position: absolute;
  z-index: -1;
  top: 50%;
  left: 0;
  width: 30px;
  height: 30px;
  content: "";
  background: #9fd5f6;
  border-radius: 50%;
  opacity: .48;
  transform: translateY(-50%);
}

body#top.kp-under-v1 h2.kp-under-heading::after {
  display: none !important;
  width: 0 !important;
  height: 0 !important;
  margin: 0 !important;
  content: none !important;
  background: none !important;
}

/* H3〜H6へ共通H2クラスが付いても、丸・大文字・余白を引き継がせない。 */
body#top.kp-under-v1 .kp-under-body h3.kp-under-heading,
body#top.kp-under-v1 .kp-under-body h4.kp-under-heading,
body#top.kp-under-v1 .kp-under-body h5.kp-under-heading,
body#top.kp-under-v1 .kp-under-body h6.kp-under-heading {
  position: static;
  z-index: auto;
  display: block;
  width: auto;
  min-height: 0;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  letter-spacing: 0;
}

body#top.kp-under-v1 .kp-under-body h3.kp-under-heading::before,
body#top.kp-under-v1 .kp-under-body h3.kp-under-heading::after,
body#top.kp-under-v1 .kp-under-body h4.kp-under-heading::before,
body#top.kp-under-v1 .kp-under-body h4.kp-under-heading::after,
body#top.kp-under-v1 .kp-under-body h5.kp-under-heading::before,
body#top.kp-under-v1 .kp-under-body h5.kp-under-heading::after,
body#top.kp-under-v1 .kp-under-body h6.kp-under-heading::before,
body#top.kp-under-v1 .kp-under-body h6.kp-under-heading::after {
  display: none !important;
  content: none !important;
}

/* ===== 005: CMS body typography / safety ===== */
body#top.kp-under-v1 .kp-under-body {
  min-width: 0;
  color: #24364b;
  font-size: 14px;
  line-height: 1.85;
  overflow-wrap: anywhere;
}

body#top.kp-under-v1 .kp-under-body::after {
  display: block;
  clear: both;
  content: "";
}

body#top.kp-under-v1 .kp-under-body > :first-child {
  margin-top: 0;
}

body#top.kp-under-v1 .kp-under-body > :last-child {
  margin-bottom: 0;
}

body#top.kp-under-v1 .kp-under-body p {
  margin-top: 0;
  margin-bottom: 16px;
}

body#top.kp-under-v1 .kp-under-body h3,
body#top.kp-under-v1 .kp-under-body h3.kp-under-heading {
  margin: 30px 0 12px !important;
  color: #112f63 !important;
  font-size: 16px !important;
  font-weight: 800 !important;
  line-height: 1.55 !important;
}

body#top.kp-under-v1 .kp-under-body h4,
body#top.kp-under-v1 .kp-under-body h4.kp-under-heading {
  margin: 24px 0 9px !important;
  color: #17365f !important;
  font-size: 15px !important;
  font-weight: 750 !important;
  line-height: 1.6 !important;
}

body#top.kp-under-v1 .kp-under-body h5,
body#top.kp-under-v1 .kp-under-body h5.kp-under-heading {
  margin: 20px 0 8px !important;
  color: #263f61 !important;
  font-size: 14px !important;
  font-weight: 750 !important;
  line-height: 1.6 !important;
}

body#top.kp-under-v1 .kp-under-body h6,
body#top.kp-under-v1 .kp-under-body h6.kp-under-heading {
  margin: 18px 0 7px !important;
  color: #344a67 !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  line-height: 1.6 !important;
}

body#top.kp-under-v1 .kp-under-body ul,
body#top.kp-under-v1 .kp-under-body ol {
  margin-top: 12px;
  margin-bottom: 20px;
  padding-left: 1.65em;
}

body#top.kp-under-v1 .kp-under-body li {
  margin: 0 0 5px;
  line-height: 1.8;
}

body#top.kp-under-v1 .kp-under-body img,
body#top.kp-under-v1 .kp-under-body picture,
body#top.kp-under-v1 .kp-under-body video,
body#top.kp-under-v1 .kp-under-body iframe,
body#top.kp-under-v1 .kp-under-body svg {
  max-width: 100%;
}

body#top.kp-under-v1 .kp-under-body img {
  height: auto;
}

body#top.kp-under-v1 .kp-under-body table {
  width: 100%;
  max-width: 100%;
  border-collapse: collapse;
}

body#top.kp-under-v1 .kp-under-body th,
body#top.kp-under-v1 .kp-under-body td {
  overflow-wrap: anywhere;
}

/* 長文だけ読みやすく狭めたい場合、CMS本文内で任意使用。 */
body#top.kp-under-v1 .kp-under-prose {
  width: min(100%, 960px);
  margin-right: auto;
  margin-left: auto;
}


/* ===== 005-2: body alignment under CMS H2 ===== */
/*
 * 共通H2は丸装飾のため文字開始位置が左端から15px内側になる。
 * 見出し付きブロックの本文も同じ位置へ揃え、
 * 本文だけがH2より左へ突き出して見える状態を防ぐ。
 */
body#top.kp-under-v1
.kp-under-content__safety >
.kp-under-block--default-heading >
.kp-under-body {
  padding-left: 15px !important;
}

/* JavaScript停止時のフォールバック */
body#top.kp-under-v1
.kp-under-content >
.kp-under-block--default-heading:nth-child(n + 2) >
.kp-under-body {
  padding-left: 15px !important;
}

@media screen and (max-width: 768px) {
  body#top.kp-under-v1
  .kp-under-content__safety >
  .kp-under-block--default-heading >
  .kp-under-body,
  body#top.kp-under-v1
  .kp-under-content >
  .kp-under-block--default-heading:nth-child(n + 2) >
  .kp-under-body {
    padding-left: 13px !important;
  }
}

/* ===== 006: lower-page quick buttons ===== */
/*
 * 同じ3ボタンを画面幅で移動する。
 * 1500px以上：完成済みヘッダーの空き領域
 * 1025〜1499px：パンくず帯の右側
 * 1024px以下：既存モバイル操作を優先して非表示
 */
body#top.kp-under-v1 #kpSiteHeader .kp-header-inner {
  position: relative !important;
}

body#top.kp-under-v1 .kp-under-header-actions {
  z-index: 4;
  min-width: 0;
  margin: 0;
  padding: 0;
  list-style: none;
  pointer-events: auto;
}

body#top.kp-under-v1 .kp-under-header-actions__item {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 0;
  margin: 0;
  overflow: hidden;
  color: #fff;
  border: 1px solid rgba(0, 0, 0, .12);
  border-radius: 3px;
  box-shadow:
    0 5px 12px rgba(14, 48, 94, .12),
    inset 0 1px 0 rgba(255, 255, 255, .23);
  font-weight: 850;
  line-height: 1.1;
  letter-spacing: -.02em;
  text-align: center;
  text-decoration: none;
  white-space: nowrap;
  transition:
    transform .16s ease,
    filter .16s ease,
    box-shadow .16s ease;
}

body#top.kp-under-v1 .kp-under-header-actions__item::after {
  position: absolute;
  z-index: 1;
  top: 0;
  right: 0;
  height: 100%;
  content: "";
  background: rgba(255, 255, 255, .96);
  clip-path: polygon(35% 0, 100% 0, 100% 100%, 0 100%);
  pointer-events: none;
}

body#top.kp-under-v1 .kp-under-header-actions__item span {
  position: relative;
  z-index: 2;
  display: block;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
}

body#top.kp-under-v1 .kp-under-header-actions__item i {
  position: absolute;
  z-index: 2;
  top: 50%;
  display: block;
  margin: 0;
  color: currentColor;
  font-style: normal;
  font-weight: 500;
  line-height: 1;
  transform: translateY(-53%);
  pointer-events: none;
}

body#top.kp-under-v1 .kp-under-header-actions__item--estimate {
  color: #fff;
  background: linear-gradient(110deg, #f39a20 0%, #e87900 100%);
  border-color: #d66d00;
}

body#top.kp-under-v1 .kp-under-header-actions__item--estimate i {
  color: #df7500;
}

body#top.kp-under-v1 .kp-under-header-actions__item--gps {
  color: #fff;
  background: linear-gradient(110deg, #3c6ec4 0%, #244b91 100%);
  border-color: #214583;
}

body#top.kp-under-v1 .kp-under-header-actions__item--gps i {
  color: #2d5aa5;
}

body#top.kp-under-v1 .kp-under-header-actions__item--area {
  color: #fff;
  background: linear-gradient(110deg, #58a473 0%, #347d51 100%);
  border-color: #2f7249;
}

body#top.kp-under-v1 .kp-under-header-actions__item--area i {
  color: #3d895a;
}

body#top.kp-under-v1 .kp-under-header-actions__item:hover,
body#top.kp-under-v1 .kp-under-header-actions__item:focus-visible {
  filter: brightness(1.045);
  transform: translateY(-1px);
  box-shadow:
    0 8px 16px rgba(14, 48, 94, .18),
    inset 0 1px 0 rgba(255, 255, 255, .3);
}

body#top.kp-under-v1 .kp-under-header-actions__item:focus-visible {
  outline: 2px solid #fff;
  outline-offset: -3px;
}

/* 大画面：ヘッダー骨格には参加させず、空き領域へ絶対配置。 */
@media screen and (min-width: 1500px) {
  body#top.kp-under-v1 #kpSiteHeader .kp-under-header-actions {
    position: absolute;
    top: 7px;
    left: calc(
      clamp(132px, 10.3125vw, 198px) +
      clamp(612px, 51.0417vw, 980px) +
      8px
    );
    right: calc(
      clamp(144px, 10.7292vw, 206px) +
      clamp(130px, 7.8125vw, 150px) +
      8px
    );
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 4px;
    height: 36px;
  }

  body#top.kp-under-v1 #kpSiteHeader .kp-under-header-actions__item {
    height: 36px;
    padding: 0 28px 0 7px;
    font-size: clamp(9px, .64vw, 11.5px);
  }

  body#top.kp-under-v1 #kpSiteHeader .kp-under-header-actions__item::after {
    width: 29px;
  }

  body#top.kp-under-v1 #kpSiteHeader .kp-under-header-actions__item i {
    right: 7px;
    font-size: 20px;
  }
}

/* 1400px・1200px級：パンくずの右側へ移動。 */
@media screen and (min-width: 1025px) and (max-width: 1499px) {
  body#top.kp-under-v1 .kp-under-context-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 16px;
    min-height: 50px;
  }

  body#top.kp-under-v1 .kp-under-context-row .kp-under-breadcrumb {
    min-width: 0;
    overflow: hidden;
  }

  body#top.kp-under-v1 .kp-under-context-row .kp-under-breadcrumb ol {
    min-height: 50px;
    padding-top: 8px;
    padding-bottom: 8px;
  }

  body#top.kp-under-v1 .kp-under-context-row .kp-under-breadcrumb li:last-child,
  body#top.kp-under-v1 .kp-under-context-row .kp-under-breadcrumb li:last-child a {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  body#top.kp-under-v1 .kp-under-context-row .kp-under-header-actions {
    position: static;
    display: grid;
    grid-template-columns: 112px 108px 100px;
    gap: 5px;
    width: auto;
    height: 34px;
  }

  body#top.kp-under-v1 .kp-under-context-row .kp-under-header-actions__item {
    height: 34px;
    padding: 0 25px 0 9px;
    font-size: 10.5px;
  }

  body#top.kp-under-v1 .kp-under-context-row .kp-under-header-actions__item::after {
    width: 26px;
  }

  body#top.kp-under-v1 .kp-under-context-row .kp-under-header-actions__item i {
    right: 7px;
    font-size: 18px;
  }
}

@media screen and (max-width: 1024px) {
  body#top.kp-under-v1 .kp-under-header-actions {
    display: none !important;
  }
}

/* ===== 007: desktop hover / focus / touch dropdown ===== */
@media screen and (min-width: 1200px) {
  body#top.kp-under-v1 #kpGlobalNav > ul > .kp-nav-item--has-dropdown {
    overflow: visible !important;
  }

  body#top.kp-under-v1 #kpGlobalNav .kp-nav-dropdown {
    position: absolute;
    z-index: 1500;
    top: 100%;
    left: 0;
    display: block;
    width: 320px;
    max-height: min(66vh, 610px);
    margin: 0;
    padding: 0;
    overflow-x: hidden;
    overflow-y: auto;
    color: #173d72;
    background: #fff;
    border: 1px solid #d3deeb;
    box-shadow: 0 18px 36px rgba(13, 42, 82, .2);
    opacity: 0;
    visibility: hidden;
    transform: translateY(8px);
    pointer-events: none;
    overscroll-behavior: contain;
    scrollbar-width: thin;
    transition: opacity .16s ease, visibility .16s ease, transform .16s ease;
  }

  body#top.kp-under-v1 #kpGlobalNav .kp-nav-dropdown--area {
    width: 340px;
  }

  body#top.kp-under-v1 #kpGlobalNav .kp-nav-item--dropdown-right > .kp-nav-dropdown {
    right: 0;
    left: auto;
  }

  body#top.kp-under-v1 #kpGlobalNav .kp-nav-item--has-dropdown:hover > .kp-nav-dropdown,
  body#top.kp-under-v1 #kpGlobalNav .kp-nav-item--has-dropdown:focus-within > .kp-nav-dropdown,
  body#top.kp-under-v1 #kpGlobalNav .kp-nav-item--has-dropdown.is-dropdown-open > .kp-nav-dropdown {
    display: block !important;
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
    pointer-events: auto;
  }

  body#top.kp-under-v1 #kpGlobalNav .kp-nav-dropdown__title {
    position: sticky;
    z-index: 2;
    top: 0;
    margin: 0;
    padding: 13px 16px;
    color: #082b67;
    background: #e9f3fd;
    border-bottom: 1px solid #d3deeb;
    font-size: 13px;
    font-weight: 900;
    line-height: 1.45;
    letter-spacing: -.01em;
  }

  body#top.kp-under-v1 #kpGlobalNav .kp-nav-dropdown__list {
    display: block !important;
    width: 100% !important;
    height: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
  }

  body#top.kp-under-v1 #kpGlobalNav .kp-nav-dropdown__list > li {
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
    height: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    border-bottom: 1px solid #e6ecf3;
    list-style: none !important;
  }

  body#top.kp-under-v1 #kpGlobalNav .kp-nav-dropdown__list > li:last-child {
    border-bottom: 0;
  }

  body#top.kp-under-v1 #kpGlobalNav .kp-nav-dropdown__list > li + li::before {
    display: none !important;
    content: none !important;
  }

  body#top.kp-under-v1 #kpGlobalNav .kp-nav-dropdown__list a {
    position: relative !important;
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: flex-start !important;
    width: 100% !important;
    min-width: 0 !important;
    min-height: 45px !important;
    height: auto !important;
    margin: 0 !important;
    padding: 10px 36px 10px 15px !important;
    overflow: visible !important;
    color: #173d72 !important;
    background: #fff !important;
    border: 0 !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    line-height: 1.5 !important;
    letter-spacing: 0 !important;
    text-align: left !important;
    text-decoration: none !important;
    white-space: normal !important;
    overflow-wrap: anywhere;
  }

  body#top.kp-under-v1 #kpGlobalNav .kp-nav-dropdown__list a::before {
    display: none !important;
    content: none !important;
  }

  body#top.kp-under-v1 #kpGlobalNav .kp-nav-dropdown__list a::after {
    position: absolute !important;
    top: 50% !important;
    right: 15px !important;
    bottom: auto !important;
    left: auto !important;
    width: auto !important;
    height: auto !important;
    content: "›" !important;
    color: #55779f !important;
    background: transparent !important;
    font-size: 20px !important;
    font-weight: 500 !important;
    line-height: 1 !important;
    transform: translateY(-54%) !important;
    transition: transform .15s ease !important;
  }

  body#top.kp-under-v1 #kpGlobalNav .kp-nav-dropdown__list a:hover,
  body#top.kp-under-v1 #kpGlobalNav .kp-nav-dropdown__list a:focus-visible {
    color: #082b67 !important;
    background: #f2f7fd !important;
  }

  body#top.kp-under-v1 #kpGlobalNav .kp-nav-dropdown__list a:hover::after,
  body#top.kp-under-v1 #kpGlobalNav .kp-nav-dropdown__list a:focus-visible::after {
    transform: translate(2px, -54%) !important;
  }

  body#top.kp-under-v1 #kpGlobalNav .kp-nav-dropdown__list a:focus-visible {
    outline: 2px solid #4d79b3;
    outline-offset: -2px;
  }
}

body#top.kp-under-v1 #kpGlobalNav .kp-nav-dropdown[hidden] {
  display: none !important;
}

@media screen and (max-width: 1199px) {
  body#top.kp-under-v1 #kpGlobalNav .kp-nav-dropdown {
    display: none !important;
  }
}

/* ===== 008: responsive content ===== */
@media screen and (max-width: 1024px) {
  body#top.kp-under-v1 .kp-under-wide-container {
    width: calc(100% - 40px);
  }

  body#top.kp-under-v1 .kp-under-content__safety,
  body#top.kp-under-v1 .kp-under-content > .kp-under-block:nth-child(n + 2) {
    width: calc(100% - 48px) !important;
  }

  body#top.kp-under-v1 .kp-under-block--default-heading {
    padding-top: 42px !important;
  }

  body#top.kp-under-v1 .kp-under-block--custom-heading,
  body#top.kp-under-v1 .kp-under-block--no-heading {
    padding-top: 0 !important;
  }
}

@media screen and (max-width: 768px) {
  body#top.kp-under-v1 .kp-under-page {
    padding-top: 60px;
  }

  body#top.kp-under-v1 main#main.kp-under-main {
    padding-bottom: 68px !important;
  }

  body#top.kp-under-v1 .kp-under-wide-container {
    width: calc(100% - 32px);
  }

  body#top.kp-under-v1 .kp-under-breadcrumb ol {
    min-height: 32px;
    padding: 6px 0;
  }

  body#top.kp-under-v1 .kp-under-breadcrumb li {
    font-size: 10px;
  }

  body#top.kp-under-v1 .kp-under-block--hero {
    width: 100% !important;
    max-width: 100% !important;
  }

  body#top.kp-under-v1 .kp-under-hero-frame {
    height: auto !important;
    min-height: clamp(280px, 78vw, 390px);
  }

  body#top.kp-under-v1 .kp-under-hero-frame h1 {
    max-width: calc(100% - 32px);
    font-size: clamp(29px, 9.2vw, 42px) !important;
    line-height: 1.18 !important;
  }

  body#top.kp-under-v1 .kp-under-content__safety,
  body#top.kp-under-v1 .kp-under-content > .kp-under-block:nth-child(n + 2) {
    width: calc(100% - 32px) !important;
    max-width: none !important;
  }

  body#top.kp-under-v1 .kp-under-block--default-heading {
    padding-top: 50px !important;
  }

  body#top.kp-under-v1 .kp-under-block--custom-heading,
  body#top.kp-under-v1 .kp-under-block--no-heading {
    padding-top: 0 !important;
  }

  body#top.kp-under-v1 .kp-under-block--first-content.kp-under-block--default-heading {
    padding-top: 36px !important;
  }

  body#top.kp-under-v1 .kp-under-block--first-content.kp-under-block--custom-heading,
  body#top.kp-under-v1 .kp-under-block--first-content.kp-under-block--no-heading {
    padding-top: 0 !important;
  }

  body#top.kp-under-v1 h2.kp-under-heading {
    min-height: 27px;
    margin-bottom: 20px !important;
    padding-left: 13px !important;
    font-size: clamp(19px, 5.7vw, 23px) !important;
    line-height: 1.35 !important;
  }

  body#top.kp-under-v1 h2.kp-under-heading::before {
    width: 27px;
    height: 27px;
  }

  body#top.kp-under-v1 .kp-under-body {
    font-size: 14px;
    line-height: 1.82;
  }

  body#top.kp-under-v1 .kp-under-body h3,
  body#top.kp-under-v1 .kp-under-body h3.kp-under-heading {
    margin-top: 26px !important;
    font-size: 16px !important;
  }

  body#top.kp-under-v1 .kp-under-body h4,
  body#top.kp-under-v1 .kp-under-body h4.kp-under-heading {
    margin-top: 21px !important;
    font-size: 15px !important;
  }
}

@media screen and (max-width: 420px) {
  body#top.kp-under-v1 .kp-under-wide-container,
  body#top.kp-under-v1 .kp-under-content__safety,
  body#top.kp-under-v1 .kp-under-content > .kp-under-block:nth-child(n + 2) {
    width: calc(100% - 24px) !important;
  }
}


/* ===== 009: lower-page footer responsive bridge ===== */
/*
 * TOP共通フッターの形は維持し、1025〜1440pxだけ早めに2列ナビへ切り替える。
 * 右側が画面外へ切れる問題を防ぐための下層接続補正。
 */
@media screen and (min-width: 1025px) and (max-width: 1440px) {
  body#top.kp-under-v1 footer#kpSiteFooterV02 {
    width: 100% !important;
    min-width: 0 !important;
    overflow-x: clip !important;
  }

  body#top.kp-under-v1 footer#kpSiteFooterV02 .kpfooter02__inner {
    width: calc(100% - 48px) !important;
    min-width: 0 !important;
    max-width: 1200px !important;
    margin-right: auto !important;
    margin-left: auto !important;
  }

  body#top.kp-under-v1 footer#kpSiteFooterV02 .kpfooter02__upperGrid {
    grid-template-columns: minmax(270px, 310px) minmax(0, 1fr) !important;
  }

  body#top.kp-under-v1 footer#kpSiteFooterV02 .kpfooter02__company {
    padding: 30px 22px 28px !important;
  }

  body#top.kp-under-v1 footer#kpSiteFooterV02 .kpfooter02__navigation {
    min-width: 0 !important;
    padding: 30px 0 28px 28px !important;
    overflow: hidden !important;
  }

  body#top.kp-under-v1 footer#kpSiteFooterV02 .kpfooter02__nav {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 28px 24px !important;
  }

  body#top.kp-under-v1 footer#kpSiteFooterV02 .kpfooter02__navGroup {
    min-width: 0 !important;
    padding: 0 !important;
  }

  body#top.kp-under-v1 footer#kpSiteFooterV02 .kpfooter02__navGroup::before {
    display: none !important;
    content: none !important;
  }

  body#top.kp-under-v1 footer#kpSiteFooterV02 .kpfooter02__navGroup:nth-child(3) {
    grid-column: 1 / -1 !important;
  }

  body#top.kp-under-v1 footer#kpSiteFooterV02 .kpfooter02__navGroup:nth-child(3) .kpfooter02__navList {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 8px 24px !important;
  }

  body#top.kp-under-v1 footer#kpSiteFooterV02 .kpfooter02__navList a {
    min-width: 0 !important;
    overflow-wrap: anywhere !important;
  }

  body#top.kp-under-v1 footer#kpSiteFooterV02 .kpfooter02__networkInner {
    grid-template-columns: 190px minmax(0, 1fr) !important;
    gap: 20px !important;
  }

  body#top.kp-under-v1 footer#kpSiteFooterV02 .kpfooter02__networkList {
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 14px 10px !important;
  }

  body#top.kp-under-v1 footer#kpSiteFooterV02 .kpfooter02__networkList li::after {
    display: none !important;
    content: none !important;
  }

  body#top.kp-under-v1 footer#kpSiteFooterV02 .kpfooter02__networkList a,
  body#top.kp-under-v1 footer#kpSiteFooterV02 .kpfooter02__networkList span {
    width: 100% !important;
    min-width: 0 !important;
    white-space: normal !important;
    overflow-wrap: anywhere !important;
  }
}

/* スマホは拠点一覧を2列の同じカード形状にして、縦長になりすぎるのを防ぐ。 */
@media screen and (max-width: 500px) {
  body#top.kp-under-v1 footer#kpSiteFooterV02 .kpfooter02__inner {
    width: calc(100% - 24px) !important;
  }

  body#top.kp-under-v1 footer#kpSiteFooterV02 .kpfooter02__networkList {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 8px !important;
  }

  body#top.kp-under-v1 footer#kpSiteFooterV02 .kpfooter02__networkList li {
    min-width: 0 !important;
  }

  body#top.kp-under-v1 footer#kpSiteFooterV02 .kpfooter02__networkList li::after {
    display: none !important;
    content: none !important;
  }

  body#top.kp-under-v1 footer#kpSiteFooterV02 .kpfooter02__networkList a,
  body#top.kp-under-v1 footer#kpSiteFooterV02 .kpfooter02__networkList span {
    position: relative !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    width: 100% !important;
    min-width: 0 !important;
    min-height: 38px !important;
    margin: 0 !important;
    padding: 8px 7px 8px 24px !important;
    color: #173d72 !important;
    background: rgba(255, 255, 255, .72) !important;
    border: 1px solid rgba(18, 59, 117, .12) !important;
    border-radius: 3px !important;
    font-size: 11px !important;
    font-weight: 750 !important;
    line-height: 1.35 !important;
    text-align: left !important;
    white-space: normal !important;
    overflow-wrap: anywhere !important;
  }

  body#top.kp-under-v1 footer#kpSiteFooterV02 .kpfooter02__networkList a::before,
  body#top.kp-under-v1 footer#kpSiteFooterV02 .kpfooter02__networkList span::before {
    left: 9px !important;
    top: 50% !important;
    width: 7px !important;
    height: 7px !important;
    box-shadow: none !important;
    transform: translateY(-50%) !important;
  }
}

@media screen and (max-width: 360px) {
  body#top.kp-under-v1 footer#kpSiteFooterV02 .kpfooter02__networkList {
    grid-template-columns: 1fr !important;
  }
}

/* ===== 010: accessibility / motion ===== */

@media (prefers-reduced-motion: reduce) {
  body#top.kp-under-v1 *,
  body#top.kp-under-v1 *::before,
  body#top.kp-under-v1 *::after {
    scroll-behavior: auto !important;
    transition-duration: .01ms !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
  }
}
