/* =========================================================
   bumon-group.php 専用CSS
========================================================= */

/* =========================================================
   共通：事業部ページ本文
========================================================= */
.bumon-group-hgroup{
  display:block;
  width:100%;
  margin:0 auto;
}

.bumon-group-hgroup h1{
  display:block;
  width:100%;
  margin:0 0 50px;
  font-size:32px;
  line-height:1.4;
}

.bumon-group-hgroup p{
  display:block;
  width:100%;
  max-width:760px;
  font-size:16px;
  line-height:2;
}

/* =========================================================
   共通：事業部メイン画像
========================================================= */
.bumon-group-main-figure{
  width:100%;
  margin:0;
}

.bumon-group-main-img{
  display:block;
  width:108%;
  max-width:none;
  height:auto;
  margin-left:-4%;
}


/* =========================================================
   共通：業務を見る
========================================================= */
.dept-work-menu{position:relative;display:inline-block;margin-top:40px;}
.dept-work-btn{display:inline-block;width:auto;padding:0 0 4px;background:transparent;border:none;border-bottom:1px solid #666;color:#666;font-size:16px;font-weight:700;cursor:default;}
.dept-work-list{display:block !important;margin:16px 0 0 !important;padding:0 !important;list-style:none !important;background:transparent !important;border:none !important;}
.dept-work-list a{display:block;margin-bottom:10px;color:#444;line-height:1.6;text-decoration:none;word-break:keep-all;}
.dept-work-list a::before{content:"";display:inline-block;width:10px;height:10px;margin-right:10px;background:#c0d2f0;clip-path:polygon(0 0,100% 50%,0 100%);border-radius:2px;}

/* =========================================================
   全部門共通：業務リンク（PHPの列分けを維持）
========================================================= */
.dept-work-menu:has(.dept-fixed-links){display:block !important;width:100% !important;margin-top:40px;}
.dept-work-menu .dept-work-menu-title{display:inline-block !important;width:auto !important;margin:0 !important;padding:0 0 4px !important;border-bottom:1px solid #666;color:#666;font-size:16px;font-weight:700;}
.dept-work-menu .dept-fixed-links{display:flex !important;flex-direction:row !important;align-items:flex-start !important;justify-content:flex-start !important;gap:24px !important;width:100% !important;height:auto !important;margin:16px 0 0 !important;padding:0 !important;}
.dept-work-menu .dept-fixed-col{display:flex !important;flex:1 1 0 !important;flex-direction:column !important;align-items:stretch !important;justify-content:flex-start !important;gap:16px !important;width:auto !important;min-width:0 !important;height:auto !important;margin:0 !important;padding:0 !important;}
.dept-work-menu .dept-fixed-col > a{display:block !important;position:static !important;flex:none !important;width:100% !important;height:auto !important;margin:0 !important;padding:0 !important;color:#444;font-size:16px;line-height:1.6 !important;text-decoration:none;word-break:keep-all;transform:none !important;transition:none !important;}
.dept-work-menu .dept-fixed-col > a::before{content:"";display:inline-block;width:10px;height:10px;margin-right:10px;background:#c0d2f0;clip-path:polygon(0 0,100% 50%,0 100%);}
.dept-work-menu .dept-leaflet-link{margin-top:24px;}


/* =========================================================
   計画系・環境系事業部：業務リンク2列表示
========================================================= */
:is(.engan-keikaku,.kankyo-keikaku,.engan-kankyo,.okinawa-kankyo,.kasen-kankyo) .dept-work-menu .dept-fixed-links{
  display:flex !important;
  flex-direction:row !important;
  flex-wrap:nowrap !important;
  align-items:flex-start !important;
  justify-content:flex-start !important;
  gap:32px !important;
  width:100% !important;
  margin:20px 0 0 !important;
  padding:0 !important;
}
:is(.engan-keikaku,.kankyo-keikaku,.engan-kankyo,.okinawa-kankyo,.kasen-kankyo) .dept-work-menu .dept-fixed-col{
  display:flex !important;
  flex:1 1 0 !important;
  flex-direction:column !important;
  justify-content:flex-start !important;
  align-items:stretch !important;
  gap:24px !important;
  width:0 !important;
  min-width:0 !important;
  height:auto !important;
  margin:0 !important;
  padding:0 !important;
}
:is(.engan-keikaku,.kankyo-keikaku,.engan-kankyo,.okinawa-kankyo,.kasen-kankyo) .dept-work-menu .dept-fixed-col > a{
  display:block !important;
  flex:none !important;
  width:100% !important;
  height:auto !important;
  min-height:0 !important;
  margin:0 !important;
  padding:0 !important;
  line-height:1.6 !important;
}
:is(.engan-keikaku,.kankyo-keikaku,.engan-kankyo,.okinawa-kankyo,.kasen-kankyo) .dept-work-menu .dept-fixed-col > p{
  display:contents !important;
}
:is(.engan-keikaku,.kankyo-keikaku,.engan-kankyo,.okinawa-kankyo,.kasen-kankyo) .dept-work-menu .dept-fixed-col > br{
  display:none !important;
}
@media(max-width:767px){
  :is(.engan-keikaku,.kankyo-keikaku,.engan-kankyo,.okinawa-kankyo,.kasen-kankyo) .dept-work-menu .dept-fixed-links{
    flex-direction:column !important;
    gap:24px !important;
  }
  :is(.engan-keikaku,.kankyo-keikaku,.engan-kankyo,.okinawa-kankyo,.kasen-kankyo) .dept-work-menu .dept-fixed-col{
    flex:none !important;
    width:100% !important;
  }
}

/* =========================================================
   防災解析部：業務を見る（固定2列）
========================================================= */
.bousai-kaiseki .dept-work-menu{display:block !important;width:100% !important;margin-top:40px !important;}
.bousai-kaiseki .dept-work-menu .dept-fixed-links{display:flex !important;flex-direction:row !important;flex-wrap:nowrap !important;align-items:flex-start !important;justify-content:flex-start !important;gap:24px !important;width:100% !important;height:auto !important;}
.bousai-kaiseki .dept-work-menu .dept-fixed-col{display:flex !important;flex:1 1 0 !important;flex-direction:column !important;align-items:stretch !important;justify-content:flex-start !important;gap:46px !important;width:0 !important;min-width:0 !important;height:auto !important;}
.bousai-kaiseki .dept-work-menu .dept-fixed-col > a{display:block !important;flex:none !important;width:100% !important;height:auto !important;margin:0 !important;padding:0 !important;color:#666 !important;font-size:16px !important;font-weight:400 !important;line-height:1.6 !important;}
.bousai-kaiseki .dept-work-menu > p,
.bousai-kaiseki .dept-fixed-links > p,
.bousai-kaiseki .dept-fixed-col > p{display:contents !important;}
.bousai-kaiseki .dept-fixed-links > br,
.bousai-kaiseki .dept-fixed-col > br{display:none !important;}
.bousai-kaiseki .dept-leaflet-link{margin-top:24px !important;}
@media(max-width:767px){
  .bousai-kaiseki .dept-work-menu .dept-fixed-links{flex-direction:column !important;gap:16px !important;}
  .bousai-kaiseki .dept-work-menu .dept-fixed-col{flex:none !important;width:100% !important;}
}



/* =========================================================
   構造解析部：業務を見る（固定2列）
========================================================= */
.kouzo-kaiseki .dept-work-menu{display:block !important;width:100% !important;margin-top:40px !important;}
.kouzo-kaiseki .dept-work-menu .dept-fixed-links{display:flex !important;flex-direction:row !important;flex-wrap:nowrap !important;align-items:flex-start !important;justify-content:flex-start !important;gap:24px !important;width:100% !important;height:auto !important;}
.kouzo-kaiseki .dept-work-menu .dept-fixed-col{display:flex !important;flex:1 1 0 !important;flex-direction:column !important;align-items:stretch !important;justify-content:flex-start !important;gap:46px !important;width:0 !important;min-width:0 !important;height:auto !important;}
.kouzo-kaiseki .dept-work-menu .dept-fixed-col > a{display:block !important;flex:none !important;width:100% !important;height:auto !important;margin:0 !important;padding:0 !important;color:#666 !important;font-size:16px !important;font-weight:400 !important;line-height:1.6 !important;}
.kouzo-kaiseki .dept-work-menu > p,
.kouzo-kaiseki .dept-fixed-links > p,
.kouzo-kaiseki .dept-fixed-col > p{display:contents !important;}
.kouzo-kaiseki .dept-fixed-links > br,
.kouzo-kaiseki .dept-fixed-col > br{display:none !important;}
.kouzo-kaiseki .dept-leaflet-link{margin-top:24px !important;}
@media(max-width:767px){
  .kouzo-kaiseki .dept-work-menu .dept-fixed-links{flex-direction:column !important;gap:16px !important;}
  .kouzo-kaiseki .dept-work-menu .dept-fixed-col{flex:none !important;width:100% !important;}
}



/* =========================================================
   防災系事業部4部門：業務リンク共通設定
========================================================= */
:is(.bousai-kaiseki,.kouzo-kaiseki,.chousa-kaiseki,.kankyo-kaiseki) .dept-work-menu{
  display:block !important;
  width:100% !important;
  margin-top:40px !important;
}
:is(.bousai-kaiseki,.kouzo-kaiseki,.chousa-kaiseki,.kankyo-kaiseki) .dept-work-menu .dept-fixed-links{
  display:flex !important;
  flex-direction:row !important;
  flex-wrap:nowrap !important;
  align-items:flex-start !important;
  gap:32px !important;
  width:100% !important;
  margin:20px 0 0 !important;
  padding:0 !important;
}
:is(.bousai-kaiseki,.kouzo-kaiseki,.chousa-kaiseki,.kankyo-kaiseki) .dept-work-menu .dept-fixed-col{
  display:flex !important;
  flex:1 1 0 !important;
  flex-direction:column !important;
  align-items:stretch !important;
  justify-content:flex-start !important;
  gap:16px !important;
  width:0 !important;
  min-width:0 !important;
  margin:0 !important;
  padding:0 !important;
}
:is(.bousai-kaiseki,.kouzo-kaiseki,.chousa-kaiseki,.kankyo-kaiseki) .dept-work-menu .dept-fixed-col > a{
  display:block !important;
  flex:none !important;
  width:100% !important;
  height:auto !important;
  min-height:0 !important;
  margin:0 !important;
  padding:0 !important;
  color:#666 !important;
  font-size:16px !important;
  font-weight:400 !important;
  line-height:1.6 !important;
  text-decoration:none !important;
}
:is(.bousai-kaiseki,.kouzo-kaiseki,.chousa-kaiseki,.kankyo-kaiseki) .dept-work-menu .dept-fixed-col > p{
  display:contents !important;
}
:is(.bousai-kaiseki,.kouzo-kaiseki,.chousa-kaiseki,.kankyo-kaiseki) .dept-work-menu .dept-fixed-col > br{
  display:none !important;
}
:is(.bousai-kaiseki,.kouzo-kaiseki,.chousa-kaiseki,.kankyo-kaiseki) .dept-work-menu .dept-leaflet-link{
  margin-top:24px !important;
}
@media(max-width:767px){
  :is(.bousai-kaiseki,.kouzo-kaiseki,.chousa-kaiseki,.kankyo-kaiseki) .dept-work-menu .dept-fixed-links{
    flex-direction:column !important;
    gap:16px !important;
  }
  :is(.bousai-kaiseki,.kouzo-kaiseki,.chousa-kaiseki,.kankyo-kaiseki) .dept-work-menu .dept-fixed-col{
    flex:none !important;
    width:100% !important;
  }
}


/* =========================================================
   調査設計部：業務を見る（2列＋もっと見る）
========================================================= */

/* =========================================================
   調査設計部：業務を見る（初期8件＋展開15件）
========================================================= */
.tyosa-sekkei .tyosa-sekkei-link-menu{
  display:block !important;
  width:100% !important;
  margin-top:40px !important;
}
.tyosa-sekkei .tyosa-sekkei-link-menu .tyosa-sekkei-all-links{
  display:flex !important;
  flex-direction:row !important;
  align-items:flex-start !important;
  gap:32px !important;
  width:100% !important;
  margin:20px 0 0 !important;
  padding:0 !important;
}
.tyosa-sekkei .tyosa-sekkei-link-menu .dept-fixed-col{
  display:flex !important;
  flex:1 1 0 !important;
  flex-direction:column !important;
  align-items:stretch !important;
  gap:24px !important;
  width:0 !important;
  min-width:0 !important;
  margin:0 !important;
  padding:0 !important;
}
.tyosa-sekkei .tyosa-sekkei-link-menu .dept-fixed-col > a,
.tyosa-sekkei .tyosa-sekkei-link-menu .tyosa-sekkei-extra > a{
  display:block !important;
  position:static !important;
  flex:none !important;
  width:100% !important;
  height:auto !important;
  min-height:0 !important;
  margin:0 !important;
  padding:0 !important;
  color:#444 !important;
  font-size:16px !important;
  font-weight:400 !important;
  line-height:1.6 !important;
  text-decoration:none !important;
  word-break:normal;
  overflow-wrap:anywhere;
  transform:none !important;
}
.tyosa-sekkei .tyosa-sekkei-link-menu .dept-fixed-col > a::before,
.tyosa-sekkei .tyosa-sekkei-link-menu .tyosa-sekkei-extra > a::before{
  content:"";
  display:inline-block;
  width:10px;
  height:10px;
  margin-right:10px;
  background:#c0d2f0;
  clip-path:polygon(0 0,100% 50%,0 100%);
}
/* 追加15件：初期状態では非表示 */
.tyosa-sekkei .tyosa-sekkei-extra{
  display:none !important;
  flex-direction:column !important;
  gap:24px !important;
  width:100% !important;
  margin:0 !important;
  padding:0 !important;
}
/* 展開時：通常リンクと同じ間隔で続ける */
.tyosa-sekkei .tyosa-sekkei-link-menu.is-expanded .tyosa-sekkei-extra{
  display:flex !important;
}
/* もっと見る・閉じる */
.tyosa-sekkei .tyosa-sekkei-more-controls{
  display:flex;
  justify-content:center;
  margin-top:32px;
}
.tyosa-sekkei .tyosa-sekkei-more-btn{
  box-sizing:border-box;
  display:block;
  width:fit-content;
  min-width:260px;
  max-width:100%;
  margin:0 auto;
  padding:12px 28px;
  border:1px solid #bbb;
  border-radius:9999px;
  background:#fff;
  color:#555;
  font-size:14px;
  font-weight:500;
  line-height:1.6;
  text-align:center;
  cursor:pointer;
  transition:background .2s,border-color .2s;
}
.tyosa-sekkei .tyosa-sekkei-more-btn:hover{
  background:#f5f7fa;
  border-color:#999;
}
/* hidden属性を確実に反映 */
.tyosa-sekkei .tyosa-sekkei-more-btn[hidden]{
  display:none !important;
}
.tyosa-sekkei .tyosa-sekkei-link-menu .dept-leaflet-menu{
  margin-top:30px;
}
/* スマートフォン */
@media(max-width:767px){
  .tyosa-sekkei .tyosa-sekkei-link-menu .tyosa-sekkei-all-links{
    flex-direction:column !important;
    gap:24px !important;
  }
  .tyosa-sekkei .tyosa-sekkei-link-menu .dept-fixed-col{
    flex:none !important;
    width:100% !important;
    gap:18px !important;
  }
  .tyosa-sekkei .tyosa-sekkei-extra{
    gap:18px !important;
  }
  .tyosa-sekkei .tyosa-sekkei-link-menu .dept-fixed-col > a,
  .tyosa-sekkei .tyosa-sekkei-link-menu .tyosa-sekkei-extra > a{
    font-size:15px !important;
  }
  .tyosa-sekkei .tyosa-sekkei-more-btn{
    min-width:0;
    padding:10px 22px;
    font-size:13px;
  }
}



/* =========================================================
   構造系3部門：業務リンク間隔の最終調整
========================================================= */
:is(.kozo-sekkei,.sekkei-gijutsu,.tyosa-sekkei) .dept-work-menu .dept-fixed-links{
  display:flex !important;
  flex-direction:row !important;
  align-items:flex-start !important;
  justify-content:flex-start !important;
  gap:32px !important;
  height:auto !important;
  margin-top:20px !important;
}
:is(.kozo-sekkei,.sekkei-gijutsu,.tyosa-sekkei) .dept-work-menu .dept-fixed-links > .dept-fixed-col{
  display:flex !important;
  flex:1 1 0 !important;
  flex-direction:column !important;
  align-items:stretch !important;
  justify-content:flex-start !important;
  align-content:flex-start !important;
  gap:16px !important;
  width:0 !important;
  height:auto !important;
  min-height:0 !important;
  margin:0 !important;
  padding:0 !important;
}
/* WordPressが自動挿入したp・brによる余白を除去 */
:is(.kozo-sekkei,.sekkei-gijutsu,.tyosa-sekkei) .dept-work-menu .dept-fixed-col > p{
  display:contents !important;
  margin:0 !important;
  padding:0 !important;
}
:is(.kozo-sekkei,.sekkei-gijutsu,.tyosa-sekkei) .dept-work-menu .dept-fixed-col > br{
  display:none !important;
}
:is(.kozo-sekkei,.sekkei-gijutsu,.tyosa-sekkei) .dept-work-menu .dept-fixed-col > a{
  display:block !important;
  flex:0 0 auto !important;
  height:auto !important;
  min-height:0 !important;
  margin:0 !important;
  padding:0 !important;
  line-height:1.6 !important;
}
/* 調査設計部：追加15件 */
.tyosa-sekkei .dept-work-menu .tyosa-sekkei-extra{
  gap:16px !important;
}
.tyosa-sekkei .dept-work-menu .tyosa-sekkei-extra > p{
  display:contents !important;
}
.tyosa-sekkei .dept-work-menu .tyosa-sekkei-extra > br{
  display:none !important;
}
@media(max-width:767px){
  :is(.kozo-sekkei,.sekkei-gijutsu,.tyosa-sekkei) .dept-work-menu .dept-fixed-links{
    flex-direction:column !important;
    gap:16px !important;
  }
  :is(.kozo-sekkei,.sekkei-gijutsu,.tyosa-sekkei) .dept-work-menu .dept-fixed-links > .dept-fixed-col{
    flex:none !important;
    width:100% !important;
  }
}



/* =========================================================
   部門紹介TOPへ戻る
========================================================= */
.dept-back{
  display:flex;
  justify-content:flex-end;
  width:100%;
  margin:70px 0 0;
  padding:0 20px 0 0;
  box-sizing:border-box;
}

/* ---------------------------------------------------------
   計画系事業部と同じ丸を使った戻るボタン
--------------------------------------------------------- */
.dept-back-circle{
  position:relative;
  display:flex !important;
  align-items:center;
  justify-content:center;
  width:160px !important;
  height:160px !important;
  margin:0 !important;
  padding:0 !important;
  overflow:hidden;
  background:#f7f5fb;
  border:1px solid #a99bd0 !important;
  border-radius:50%;
  text-decoration:none !important;
  box-sizing:border-box;
  transition:transform .25s ease;
}

/* ---------------------------------------------------------
   計画系事業部のSVG
--------------------------------------------------------- */
/* =========================================================
   部門紹介TOPへ戻る
========================================================= */
.dept-back{
  display:flex;
  justify-content:flex-end;
  width:100%;
  margin:70px 0 0;
  padding:0 20px 0 0;
  box-sizing:border-box;
}

/* ---------------------------------------------------------
   計画系事業部と同じ丸を使った戻るボタン
--------------------------------------------------------- */
.dept-back-circle{
  position:relative;
  display:flex !important;
  align-items:center;
  justify-content:center;
  width:160px !important;
  height:160px !important;
  margin:0 !important;
  padding:0 !important;
  overflow:hidden;
  background:#f7f5fb;
  border:1px solid #a99bd0 !important;
  border-radius:50%;
  text-decoration:none !important;
  box-sizing:border-box;
  transition:transform .25s ease;
}

/* ---------------------------------------------------------
   計画系事業部のSVG
   WordPress側にimgを置かずCSSから表示
--------------------------------------------------------- */
.dept-back-circle::before{
  content:"";
  position:absolute;
  z-index:1;
  top:50%;
  left:50%;
  display:block;
  width:160%;
  height:160%;
  background-image:url("/wp-content/themes/ecoh/03_page-bumon/bumonmark/計画系事業部.svg");
  background-repeat:no-repeat;
  background-position:center;
  background-size:contain;
  opacity:.40;
  pointer-events:none;
  transform:translate(-50%,-50%);
}

/* ---------------------------------------------------------
   「部門紹介に戻る」
--------------------------------------------------------- */
.dept-back-circle-text{
  position:relative;
  z-index:2;
  display:block;
  margin:0;
  padding:0 10px;
  color:#7462bd;
  font-size:15px;
  font-weight:700;
  line-height:1.5;
  text-align:center;
  white-space:nowrap;
}

/* ---------------------------------------------------------
   hover
--------------------------------------------------------- */
.dept-back-circle:hover{
  transform:scale(1.04);
}

/* =========================================================
   スマホ
========================================================= */
@media screen and (max-width:700px){
  .dept-back{
    margin-top:50px;
    padding-right:10px;
  }

  .dept-back-circle{
    width:135px !important;
    height:135px !important;
  }

  .dept-back-circle-text{
    font-size:13px;
  }
}
/* ---------------------------------------------------------
   「部門紹介に戻る」
--------------------------------------------------------- */
.dept-back-circle-text{
  position:relative;
  z-index:2;
  display:block;
  margin:0;
  padding:0 10px;
  color:#7462bd;
  font-size:15px;
  font-weight:700;
  line-height:1.5;
  text-align:center;
  white-space:nowrap;
}

/* ---------------------------------------------------------
   hover
--------------------------------------------------------- */
.dept-back-circle:hover{
  transform:scale(1.04);
}

/* =========================================================
   スマホ
========================================================= */
@media screen and (max-width:700px){
  .dept-back{
    margin-top:50px;
    padding-right:10px;
  }

  .dept-back-circle{
    width:135px !important;
    height:135px !important;
  }

  .dept-back-circle-text{
    font-size:13px;
  }
}

/* =========================================================
   環境系事業部：部門紹介TOPへ戻る
========================================================= */

/* 環境系事業部の緑色の丸 */
.dept-back-kankyo .dept-back-circle{
  background:#f2f9f7;
  border-color:#9dcfc2 !important;
}

/* 計画系SVGを消して環境系事業部のSVGに変更 */
.dept-back-kankyo .dept-back-circle::before{
  background-image:url("/wp-content/themes/ecoh/03_page-bumon/bumonmark/環境系事業部.svg");
  opacity:.40;
}

/* 「部門紹介に戻る」の文字色 */
.dept-back-kankyo .dept-back-circle-text{
  color:#78b7a4;
}
/* =========================================================
   防災系事業部：部門紹介TOPへ戻る
========================================================= */

/* 防災系事業部のサーモンピンク色の丸 */
.dept-back-bousai .dept-back-circle{
  background:#fff5f3;
  border-color:#df958e !important;
}

/* 防災系事業部：円内の柄を下に移動 */
.dept-back-bousai .dept-back-circle::before{
  background-image:url("/wp-content/themes/ecoh/03_page-bumon/bumonmark/防災系事業部.svg");
  opacity:.40;
  transform:translate(-48%,-25%);
}

/* 「部門紹介に戻る」の文字色 */
.dept-back-bousai .dept-back-circle-text{
  color:#d98279;
}

/* =========================================================
   調査解析部：戻るボタンの位置調整
========================================================= */
.chousa-kaiseki .dept-back{
  margin-top:20px !important;
  padding-right:20px;
}
/* =========================================================
   構造系事業部：部門紹介TOPへ戻る
========================================================= */
.dept-back-kouzo .dept-back-circle{
  background:#f2f7fd;
  border-color:#8cb6df !important;
}

/* 構造系事業部：円内のマーク */
.dept-back-kouzo .dept-back-circle::before{
  background-image:url("/wp-content/themes/ecoh/03_page-bumon/bumonmark/構造系事業部.svg");
  background-size:62% auto;
  background-position:center center;
  background-repeat:no-repeat;
  opacity:.40;
  transform:translate(-50%,-50%);
}

.dept-back-kouzo .dept-back-circle-text{
  color:#4c91ce;
}

/* =========================================================
   国際事業部：部門紹介TOPへ戻る
========================================================= */

/* 円の背景色・枠線 */
.dept-back-kokusai .dept-back-circle{
  background:#fffaf0;
  border-color:#e0b45d !important;
}

/* 円内の地球マーク */
.dept-back-kokusai .dept-back-circle::before{
  background-image:url("/wp-content/themes/ecoh/03_page-bumon/bumonmark/国際事業部.svg");
  background-size:100% auto;
  background-position:center center;
  background-repeat:no-repeat;
  opacity:.65;
  transform:translate(-50%,-50%);
}

/* 「部門紹介に戻る」の文字 */
.dept-back-kokusai .dept-back-circle-text{
  color:#c99a45;
}

/* =========================================================
   計画系事業部
========================================================= */

/* ---------------------------------------------------------
   計画系事業部TOP
--------------------------------------------------------- */
.keikaku-jigyo{
  width:100%;
}

/* 説明文 */
.keikaku-jigyo .keikaku-jigyo-lead{
  width:100%;
  margin:16px 0 26px !important;
  color:#444;
  font-size:20px !important;
  font-weight:400 !important;
  line-height:1.8 !important;
}

/* ---------------------------------------------------------
   こんなことをやっています
--------------------------------------------------------- */
.keikaku-jigyo .keikaku-work{
  width:100%;
  margin:0;
  padding:0;
  box-sizing:border-box;
}

.keikaku-jigyo .keikaku-work-title{
  margin:0 0 10px !important;
  padding:0 !important;
  color:#555;
  font-size:22px;
  font-weight:700;
  line-height:1.5;
  text-align:center;
}

/* ---------------------------------------------------------
   正円レイアウト全体
--------------------------------------------------------- */
.keikaku-jigyo .keikaku-work-circle-layout{
  position:relative;
  width:840px;
  height:780px;
  margin:0 auto;
  padding:0;
  box-sizing:border-box;
}

/* 写真を囲む大きな正円 */
.keikaku-jigyo .keikaku-work-circle{
  position:absolute;
  z-index:1;
  top:50%;
  left:50%;
  width:730px;
  height:730px;
  border:1.5px solid #d8c4ec;
  border-radius:50%;
  transform:translate(-50%,-50%);
  box-sizing:border-box;
}

/* ---------------------------------------------------------
   業務分野 共通
--------------------------------------------------------- */
.keikaku-jigyo .keikaku-work-field{
  position:absolute;
  z-index:4;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:7px;
  min-width:160px;
  margin:0;
  padding:0;
  white-space:nowrap;
  box-sizing:border-box;
}

/* 円周上の小さい円 */
.keikaku-jigyo .keikaku-work-field-mark{
  display:flex;
  align-items:center;
  justify-content:center;
  width:58px;
  height:58px;
  margin:0;
  padding:0;
  background:#f5eefb;
  border:1px solid #d4b9eb;
  border-radius:50%;
  overflow:hidden;
  box-sizing:border-box;
}

/* 小円の中のPNGマーク */
.keikaku-jigyo .keikaku-work-field-mark img{
  display:block;
  width:38px;
  height:38px;
  max-width:none;
  margin:0 !important;
  padding:0 !important;
  object-fit:contain;
}

/* 業務名 */
.keikaku-jigyo .keikaku-work-field-text{
  display:block;
  color:#555;
  font-size:14px;
  font-weight:700;
  line-height:1.4;
  text-align:center;
}

/* 防災計画：文字だけ左へ移動 */
.keikaku-jigyo .keikaku-work-field-07 .keikaku-work-field-text{
  transform:translateX(-18px);
}

/* 環境整備・管理計画：文字だけ右へ移動 */
.keikaku-jigyo .keikaku-work-field-02 .keikaku-work-field-text{
  transform:translateX(18px);
}

/* ---------------------------------------------------------
   7分野の配置
   大円の線が小円の中心を通るように配置
--------------------------------------------------------- */

/* 01：整備・管理計画（上） */
.keikaku-jigyo .keikaku-work-field-01{
  top:-4px;
  left:50%;
  transform:translateX(-50%);
}

/* 02：環境整備・管理計画（右上） */
.keikaku-jigyo .keikaku-work-field-02{
  top:103px;
  right: 160px;
  transform:translateX(50%);
}

/* 03：景観計画（右中央） */
.keikaku-jigyo .keikaku-work-field-03{
  top:361px;
  right:60px;
  width:180px;
  transform:translateX(50%);
}

/* 04：企画・広報関連調査（右下） */
.keikaku-jigyo .keikaku-work-field-04{
  right:180px;
  bottom:18px;
  transform:translateX(50%);
}

/* 05：社会・経済環境調査（左下） */
.keikaku-jigyo .keikaku-work-field-05{
  left:180px;
  bottom:18px;
  transform:translateX(-50%);
}

/* 06：観光レクリエーション（左中央） */
.keikaku-jigyo .keikaku-work-field-06{
  top:361px;
  left:60px;
  width:180px;
  transform:translateX(-50%);
}

/* 07：防災計画（左上） */
.keikaku-jigyo .keikaku-work-field-07{
  top:103px;
  left:170px;
  transform:translateX(-50%);
}

/* ---------------------------------------------------------
   中央写真スライダー
--------------------------------------------------------- */
.keikaku-jigyo .keikaku-slider{
  position:absolute;
  z-index:3;
  top:50%;
  left:50%;
  width:490px;
  height:310px;
  margin:0;
  padding:0;
  overflow:hidden;
  border-radius:6px;
  transform:translate(-50%,-50%);
  box-sizing:border-box;
}

/* 各スライド */
.keikaku-jigyo .keikaku-slide{
  position:absolute;
  top:0;
  left:0;
  display:block;
  width:100%;
  height:100%;
  margin:0 !important;
  padding:0 !important;
  opacity:0;
  visibility:hidden;
  transition:opacity .7s ease;
}

/* 表示中のスライド */
.keikaku-jigyo .keikaku-slide.is-active{
  opacity:1;
  visibility:visible;
}

/* 写真 */
.keikaku-jigyo .keikaku-slide img{
  display:block;
  width:100%;
  height:100%;
  margin:0 !important;
  padding:0 !important;
  object-fit:cover;
}

/* 写真キャプション */
.keikaku-jigyo .keikaku-slide figcaption{
  position:absolute;
  left:0;
  bottom:0;
  width:100%;
  margin:0 !important;
  padding:9px 12px !important;
  background:rgba(0,0,0,.55);
  color:#fff;
  font-size:13px;
  line-height:1.5;
  text-align:center;
  box-sizing:border-box;
}

/* ---------------------------------------------------------
   スライダー現在位置
--------------------------------------------------------- */
.keikaku-jigyo .keikaku-slider-dots{
  position:absolute;
  z-index:5;
  top:565px;
  left:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  margin:0;
  padding:0;
  transform:translateX(-50%);
}

/* ドット */
.keikaku-jigyo .keikaku-slider-dot{
  display:block;
  width:7px;
  height:7px;
  margin:0;
  padding:0;
  background:#ccc;
  border-radius:50%;
}

/* 現在表示中 */
.keikaku-jigyo .keikaku-slider-dot.is-active{
  background:#9c72c7;
}
/* =========================================================
   計画系事業部
   沿岸計画部 / 環境計画部 共通
========================================================= */
:is(.engan-keikaku,.kankyo-keikaku){
  scroll-margin-top:80px;
}

:is(.engan-keikaku,.kankyo-keikaku) .dept-work{
  width:100%;
  margin-top:10px;
}

:is(.engan-keikaku,.kankyo-keikaku) .dept-work-guide{
  margin:0 0 10px !important;
  padding:0 !important;
  color:#666;
  font-size:13px;
  line-height:1.7;
}

:is(.engan-keikaku,.kankyo-keikaku) .dept-work-nav{
  display:flex;
  flex-direction:column;
  width:100%;
  margin:0 !important;
  padding:0 !important;
  gap:0 !important;
}

:is(.engan-keikaku,.kankyo-keikaku) .dept-work-item{
  position:relative;
  display:flex !important;
  align-items:stretch;
  width:100%;
  margin:0 !important;
  padding:0 !important;
  background:transparent;
  border:1px solid transparent;
  color:#222;
  text-align:left;
  cursor:pointer;
  box-sizing:border-box;
}

:is(.engan-keikaku,.kankyo-keikaku) .dept-work-number-box{
  display:flex !important;
  flex:0 0 64px;
  align-items:center;
  justify-content:center;
  padding:12px 8px !important;
  color:#c49cf3;
  font-size:20px;
  font-weight:700;
}

:is(.engan-keikaku,.kankyo-keikaku) .dept-work-main{
  flex:1;
  min-width:0;
}

:is(.engan-keikaku,.kankyo-keikaku) .dept-work-title-box{
  padding:8px 14px 3px !important;
  font-size:15px;
  font-weight:700;
}

:is(.engan-keikaku,.kankyo-keikaku) .dept-work-description-box{
  padding:3px 14px 8px !important;
  color:#555;
  font-size:12px;
  line-height:1.55;
}

:is(.engan-keikaku,.kankyo-keikaku) .dept-work-item:hover{
  background:#fdf4ff;
  border-color:#ac78f0;
}

:is(.engan-keikaku,.kankyo-keikaku) .dept-work-item.is-active{
  background:#fbf4ff;
  border-color:#ba78f0;
}

:is(.engan-keikaku,.kankyo-keikaku) .dept-work-visual{
  width:100%;
  margin-top:24px;
}

:is(.engan-keikaku,.kankyo-keikaku) .dept-work-panel{
  display:none;
}

:is(.engan-keikaku,.kankyo-keikaku) .dept-work-panel.is-active{
  display:block;
}

:is(.engan-keikaku,.kankyo-keikaku) .dept-work-figure{
  margin:0 !important;
}

:is(.engan-keikaku,.kankyo-keikaku) .dept-work-figure img{
  display:block;
  width:100%;
  height:auto;
  margin:0 auto;
}

:is(.engan-keikaku,.kankyo-keikaku) .dept-work-figure figcaption{
  margin-top:10px;
  color:#555;
  font-size:13px;
  text-align:center;
}



/* =========================================================
   沿岸計画部：文字サイズ調整
========================================================= */

/* 「※番号を選択していただくと～」 */
.engan-keikaku .dept-work-guide{
  font-size:16px;
  line-height:1.7;
}

/* 「港湾・漁港の整備計画」などの黒太字タイトル */
.engan-keikaku .dept-work-title-box{
  font-size:18px;
  line-height:1.5;
}

/* 「港湾全体の長期構想～」などの詳細説明 */
.engan-keikaku .dept-work-description-box{
  font-size:16px;
  line-height:1.6;
}


/* =========================================================
   環境計画部：文字サイズ調整
========================================================= */

/* 「※番号を選択していただくと～」 */
.kankyo-keikaku .dept-work-guide{
  font-size:16px;
  line-height:1.7;
}

/* 「港湾等の埋立申請図書作成」などの黒太字タイトル */
.kankyo-keikaku .dept-work-title-box{
  font-size:18px;
  line-height:1.5;
}

/* 「港湾開発における埋立申請図書の作成」などの詳細説明 */
.kankyo-keikaku .dept-work-description-box{
  font-size:16px;
  line-height:1.6;
}
/* =========================================================
   環境計画部：01 埋立申請図書の画像サイズ調整
========================================================= */
.kankyo-keikaku #work01 .dept-work-figure img{
  width:50%;
  max-width:700px;
  height:auto;
  margin:0 auto;
}
/* =========================================================
   環境系事業部
========================================================= */

/* ---------------------------------------------------------
   環境系事業部TOP
--------------------------------------------------------- */
.kankyo-jigyo{
  width:100%;
}

/* 説明文 */
.kankyo-jigyo .kankyo-jigyo-lead{
  width:100%;
  margin:16px 0 26px !important;
  color:#444;
  font-size:20px !important;
  font-weight:400 !important;
  line-height:1.8 !important;
}

/* ---------------------------------------------------------
   TOP全体
--------------------------------------------------------- */
.kankyo-jigyo .kankyo-work{
  position:relative;
  width:100%;
  margin:0;
  padding:0;
  box-sizing:border-box;
}

/* ---------------------------------------------------------
   円形レイアウト全体
--------------------------------------------------------- */
.kankyo-jigyo .kankyo-work-circle-layout{
  position:relative;
  width:840px;
  height:780px;
  margin:0 auto;
  padding:0;
  box-sizing:border-box;
}

/* 写真を囲む大きな円 */
.kankyo-jigyo .kankyo-work-circle{
  position:absolute;
  z-index:1;
  top:50%;
  left:50%;
  width:730px;
  height:730px;
  border:1.5px solid #b8dcd3;
  border-radius:50%;
  transform:translate(-50%,-50%);
  box-sizing:border-box;
}

/* ---------------------------------------------------------
   環境調査 / 河川事業 切替ボタン
--------------------------------------------------------- */
.kankyo-jigyo .kankyo-work-tabs{
  position:absolute;
  z-index:10;
  top:155px;
  left:50%;
  display:flex;
  flex-direction:row;
  justify-content:center;
  width:320px;
  margin:0;
  padding:0;
  gap:12px;
  transform:translateX(-50%);
}

/* WordPressがpタグを挿入した場合 */
.kankyo-jigyo .kankyo-work-tabs > p{
  display:contents !important;
}

.kankyo-jigyo .kankyo-work-tab{
  display:block;
  width:145px;
  margin:0 !important;
  padding:10px 16px !important;
  appearance:none;
  -webkit-appearance:none;
  background:#fff !important;
  border:1px solid #b8dcd3 !important;
  border-radius:24px;
  color:#777 !important;
  font-size:15px;
  font-weight:700;
  line-height:1.4;
  text-align:center;
  cursor:pointer;
  box-sizing:border-box;
  transition:background .25s ease,color .25s ease,border-color .25s ease;
}

/* 選択中 */
.kankyo-jigyo .kankyo-work-tab.is-active{
  background:#78b7a4 !important;
  border-color:#78b7a4 !important;
  color:#fff !important;
}

/* ---------------------------------------------------------
   環境調査 / 河川事業 グループ
--------------------------------------------------------- */
.kankyo-jigyo .kankyo-work-group{
  display:none;
}

.kankyo-jigyo .kankyo-work-group.is-active{
  display:block;
}

/* ---------------------------------------------------------
   3つの業務分野 共通
--------------------------------------------------------- */
.kankyo-jigyo .kankyo-work-field{
  position:absolute;
  z-index:5;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:7px;
  min-width:170px;
  margin:0;
  padding:0;
  white-space:nowrap;
  box-sizing:border-box;
}

/* 大円の上に重なる小円 */
.kankyo-jigyo .kankyo-work-field-mark{
  display:flex;
  align-items:center;
  justify-content:center;
  width:64px;
  height:64px;
  margin:0;
  padding:0;
  background:#eef8f5;
  border:1px solid #9dcfc2;
  border-radius:50%;
  overflow:hidden;
  box-sizing:border-box;
}

/* 小円のPNGマーク */
.kankyo-jigyo .kankyo-work-field-mark img{
  display:block;
  width:42px;
  height:42px;
  max-width:none;
  margin:0 !important;
  padding:0 !important;
  object-fit:contain;
}
/* ---------------------------------------------------------
   PNGマークごとの色
--------------------------------------------------------- */

/* 元のPNG画像は非表示 */
.kankyo-jigyo .kankyo-work-field-mark img{
  display:none;
}

/* PNGマークを表示する共通設定 */
.kankyo-jigyo .kankyo-work-field-mark::before{
  content:"";
  display:block;
  width:42px;
  height:42px;
  background-color:#0078B8;
  -webkit-mask-repeat:no-repeat;
  mask-repeat:no-repeat;
  -webkit-mask-position:center;
  mask-position:center;
  -webkit-mask-size:contain;
  mask-size:contain;
}

/* 01：水質調査 */
.kankyo-jigyo [data-kankyo-group="environment"] .kankyo-work-field-01 .kankyo-work-field-mark::before{
  background-color:#589ec4;
  -webkit-mask-image:url("/wp-content/themes/ecoh/image/bumonpng/kannkyo/Kankyo-mark1.png");
  mask-image:url("/wp-content/themes/ecoh/image/bumonpng/kannkyo/Kankyo-mark1.png");
}

/* 02：藻場調査 */
.kankyo-jigyo [data-kankyo-group="environment"] .kankyo-work-field-02 .kankyo-work-field-mark::before{
  background-color:#02cc82;
  -webkit-mask-image:url("/wp-content/themes/ecoh/image/bumonpng/kannkyo/Kankyo-mark2.png");
  mask-image:url("/wp-content/themes/ecoh/image/bumonpng/kannkyo/Kankyo-mark2.png");
}

/* 03：付着生物調査 */
.kankyo-jigyo [data-kankyo-group="environment"] .kankyo-work-field-03 .kankyo-work-field-mark::before{
  background-color:#ca8a56;
  -webkit-mask-image:url("/wp-content/themes/ecoh/image/bumonpng/kannkyo/Kankyo-mark3.png");
  mask-image:url("/wp-content/themes/ecoh/image/bumonpng/kannkyo/Kankyo-mark3.png");
}

/* 06：活用計画 */
.kankyo-jigyo [data-kankyo-group="river"] .kankyo-work-field-01 .kankyo-work-field-mark::before{
  background-color:#E5963E;
  -webkit-mask-image:url("/wp-content/themes/ecoh/image/bumonpng/kannkyo/Kankyo-mark6.png");
  mask-image:url("/wp-content/themes/ecoh/image/bumonpng/kannkyo/Kankyo-mark6.png");
}

/* 05：魚類採捕調査 */
.kankyo-jigyo [data-kankyo-group="river"] .kankyo-work-field-02 .kankyo-work-field-mark::before{
  background-color:#4AA8C7;
  -webkit-mask-image:url("/wp-content/themes/ecoh/image/bumonpng/kannkyo/Kankyo-mark5.png");
  mask-image:url("/wp-content/themes/ecoh/image/bumonpng/kannkyo/Kankyo-mark5.png");
}

/* 04：数値計算 */
.kankyo-jigyo [data-kankyo-group="river"] .kankyo-work-field-03 .kankyo-work-field-mark::before{
  background-color:#FF6670;
  -webkit-mask-image:url("/wp-content/themes/ecoh/image/bumonpng/kannkyo/Kankyo-mark4.png");
  mask-image:url("/wp-content/themes/ecoh/image/bumonpng/kannkyo/Kankyo-mark4.png");
}

/* 業務名 */
.kankyo-jigyo .kankyo-work-field-text{
  display:block;
  color:#555;
  font-size:15px;
  font-weight:700;
  line-height:1.4;
  text-align:center;
}

/* ---------------------------------------------------------
   3つの小円の配置
   大円の線が小円の中心を通るように配置
--------------------------------------------------------- */

/* 01：左下 */
.kankyo-jigyo .kankyo-work-field-01{
  top:600px;
  left:150px;
  transform:translateX(-50%);
}

/* 02：真ん中 */
.kankyo-jigyo .kankyo-work-field-02{
  top:-10px;
  right:425px;
  transform:translateX(50%);
}

/* 03：右下 */
.kankyo-jigyo .kankyo-work-field-03{
  right:132px;
  bottom:80px;
  transform:translateX(50%);
}

/* ---------------------------------------------------------
   中央写真スライダー
--------------------------------------------------------- */
.kankyo-jigyo .kankyo-slider{
  position:absolute;
  z-index:3;
  top:50%;
  left:50%;
  width:520px;
  height:330px;
  margin:0;
  padding:0;
  overflow:hidden;
  border-radius:6px;
  transform:translate(-50%,-50%);
  box-sizing:border-box;
}

/* 各スライド */
.kankyo-jigyo .kankyo-slide{
  position:absolute;
  z-index:1;
  top:0;
  left:0;
  display:block;
  width:100%;
  height:100%;
  margin:0 !important;
  padding:0 !important;
  opacity:0;
  visibility:hidden;
  overflow:hidden;
  box-sizing:border-box;
  transition:opacity .8s ease;
}

/* 表示中のスライド */
.kankyo-jigyo .kankyo-slide.is-active{
  z-index:2;
  opacity:1;
  visibility:visible;
}

/* 通常スライドの写真 */
.kankyo-jigyo .kankyo-slide > img{
  display:block !important;
  width:100% !important;
  height:100% !important;
  max-width:none !important;
  margin:0 !important;
  padding:0 !important;
  object-fit:cover !important;
}

/* 通常スライドの写真キャプション */
.kankyo-jigyo .kankyo-slide > figcaption{
  position:absolute;
  z-index:5;
  left:0;
  bottom:0;
  width:100%;
  margin:0 !important;
  padding:9px 12px !important;
  background:rgba(0,0,0,.55);
  color:#fff;
  font-size:13px;
  line-height:1.5;
  text-align:center;
  box-sizing:border-box;
}

/* ---------------------------------------------------------
   河川事業：活用計画
   平常時・災害時を正方形で2枚横並び
--------------------------------------------------------- */

/* 活用計画スライド全体 */
.kankyo-jigyo .kankyo-slide-katsuyo{
  position:absolute;
  top:0;
  left:0;
  width:100%;
  height:100%;
  margin:0 !important;
  padding:0 !important;
  overflow:hidden;
  box-sizing:border-box;
  transform:none !important;
}

/* 表示中 */
.kankyo-jigyo .kankyo-slide-katsuyo.is-active{
  display:block !important;
  opacity:1;
  visibility:visible;
}

/* 平常時 */
.kankyo-jigyo .kankyo-slide-katsuyo .kankyo-katsuyo-item:nth-of-type(1){
  position:absolute;
  top:20px;
  left:0;
  width:250px;
  height:250px;
  margin:0;
  padding:0;
  overflow:hidden;
  box-sizing:border-box;
}

/* 災害時 */
.kankyo-jigyo .kankyo-slide-katsuyo .kankyo-katsuyo-item:nth-of-type(2){
  position:absolute;
  top:20px;
  right:0;
  width:250px;
  height:250px;
  margin:0;
  padding:0;
  overflow:hidden;
  box-sizing:border-box;
}

/* 2枚の写真 */
.kankyo-jigyo .kankyo-slide-katsuyo .kankyo-katsuyo-item > img{
  display:block !important;
  width:250px !important;
  height:250px !important;
  max-width:none !important;
  max-height:none !important;
  margin:0 !important;
  padding:0 !important;
  opacity:1 !important;
  visibility:visible !important;
  object-fit:cover !important;
}

/* 「平常時」「災害時」 */
.kankyo-jigyo .kankyo-slide-katsuyo .kankyo-katsuyo-label{
  position:absolute;
  z-index:5;
  right:8px;
  bottom:8px;
  display:block;
  margin:0;
  padding:3px 7px;
  background:rgba(0,0,0,.45);
  color:#fff;
  font-size:13px;
  line-height:1.4;
  white-space:nowrap;
}

/* 2枚共通の「活用計画」帯 */
.kankyo-jigyo .kankyo-slide-katsuyo > figcaption{
  position:absolute;
  z-index:6;
  left:0;
  bottom:20px;
  width:100%;
  height:36px;
  margin:0 !important;
  padding:0 !important;
  display:flex;
  align-items:center;
  justify-content:center;
  background:rgba(0,0,0,.55);
  color:#fff;
  font-size:13px;
  line-height:1;
  text-align:center;
  box-sizing:border-box;
}

/* ---------------------------------------------------------
   環境系事業部：スライダー現在位置
--------------------------------------------------------- */
.kankyo-jigyo .kankyo-slider-dots{
  position:absolute;
  z-index:10;
  top:565px;
  left:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  margin:0;
  padding:0;
  transform:translateX(-50%);
}

/* ドット */
.kankyo-jigyo .kankyo-slider-dot{
  display:block;
  width:7px;
  height:7px;
  margin:0;
  padding:0;
  background:#ccc;
  border-radius:50%;
}

/* 現在表示中 */
.kankyo-jigyo .kankyo-slider-dot.is-active{
  background:#78b7a4;
}
/* =========================================================
   環境系事業部TOP：タブレット
========================================================= */
@media screen and (max-width:900px){

  .kankyo-jigyo .kankyo-work-circle-layout{
    width:700px;
    height:660px;
  }

  .kankyo-jigyo .kankyo-work-circle{
    width:610px;
    height:610px;
  }

  .kankyo-jigyo .kankyo-slider{
    width:430px;
    height:280px;
  }

  .kankyo-jigyo .kankyo-work-tabs{
    top:90px;
    left:-20px;
    width:130px;
  }

  .kankyo-jigyo .kankyo-work-field-01{
    top:77px;
    left:145px;
  }

  .kankyo-jigyo .kankyo-work-field-02{
    top:77px;
    right:145px;
  }

  .kankyo-jigyo .kankyo-work-field-03{
    right:92px;
    bottom:96px;
  }

  .kankyo-jigyo .kankyo-slider-dots{
    top:490px;
  }

}

/* =========================================================
   環境系事業部TOP：スマホ
========================================================= */
@media screen and (max-width:600px){

  .kankyo-jigyo .kankyo-jigyo-lead{
    font-size:15px !important;
  }

  .kankyo-jigyo .kankyo-work-tabs{
    position:relative;
    top:auto;
    left:auto;
    flex-direction:row;
    width:100%;
    margin:20px 0 18px;
    gap:10px;
  }

  .kankyo-jigyo .kankyo-work-tab{
    flex:1;
    padding:9px 8px !important;
    font-size:14px;
  }

  .kankyo-jigyo .kankyo-work-circle-layout{
    width:100%;
    height:520px;
  }

  .kankyo-jigyo .kankyo-work-circle{
    width:390px;
    max-width:94vw;
    height:390px;
    max-height:94vw;
  }

  .kankyo-jigyo .kankyo-slider{
    width:300px;
    max-width:72vw;
    height:195px;
  }

  .kankyo-jigyo .kankyo-work-field{
    min-width:110px;
  }

  .kankyo-jigyo .kankyo-work-field-mark{
    width:50px;
    height:50px;
  }

  .kankyo-jigyo .kankyo-work-field-mark img{
    width:32px;
    height:32px;
  }

  .kankyo-jigyo .kankyo-work-field-text{
    font-size:12px;
  }

  .kankyo-jigyo .kankyo-work-field-01{
    top:45px;
    left:18%;
  }

  .kankyo-jigyo .kankyo-work-field-02{
    top:45px;
    right:18%;
  }

  .kankyo-jigyo .kankyo-work-field-03{
    right:10%;
    bottom:65px;
  }

  .kankyo-jigyo .kankyo-slider-dots{
    top:385px;
  }

  /* スマホ時の活用計画ラベル */
  .kankyo-jigyo .kankyo-katsuyo-label{
    right:5px;
    bottom:38px;
    padding:2px 5px;
    font-size:11px;
  }

}
/* =========================================================
   環境系事業部
   沿岸環境部 / 沖縄環境部 共通
========================================================= */
:is(.engan-kankyo,.okinawa-kankyo){
  scroll-margin-top:80px;
}

/* ---------------------------------------------------------
   全体
--------------------------------------------------------- */
:is(.engan-kankyo,.okinawa-kankyo) :is(.engan-kankyo-work,.okinawa-kankyo-work){
  width:100%;
  margin-top:14px;
}

/* ---------------------------------------------------------
   見出し
--------------------------------------------------------- */
:is(.engan-kankyo,.okinawa-kankyo) :is(.engan-kankyo-heading,.okinawa-kankyo-heading){
  margin:0 0 14px !important;
  padding:0 0 7px !important;
  border-bottom:1px solid #d9e8e5;
  color:#78b7a4;
  font-size:18px;
  font-weight:700;
  line-height:1.5;
}

/* ---------------------------------------------------------
   写真カード一覧
   沿岸環境部：3列 → 3列 → 2列
   沖縄環境部：3列 → 3列
--------------------------------------------------------- */
:is(.engan-kankyo,.okinawa-kankyo) :is(.engan-kankyo-grid,.okinawa-kankyo-grid){
  display:grid;
  grid-template-columns:repeat(6,1fr);
  width:100%;
  margin:0 !important;
  padding:0 !important;
  gap:16px;
}

/* 通常は3列 */
:is(.engan-kankyo,.okinawa-kankyo) :is(.engan-kankyo-card,.okinawa-kankyo-card){
  grid-column:span 2;
  min-width:0;
  margin:0 !important;
  padding:0 !important;
  background:#fff;
  border:1px solid #e5e5e5;
  box-shadow:0 2px 8px rgba(0,0,0,0.06);
  box-sizing:border-box;
  overflow:hidden;
  transition:transform 0.2s ease,box-shadow 0.2s ease;
}

/* 沿岸環境部のみ7・8枚目を中央寄せ */
.engan-kankyo .engan-kankyo-card:nth-child(7){
  grid-column:2 / span 2;
}

.engan-kankyo .engan-kankyo-card:nth-child(8){
  grid-column:4 / span 2;
}

/* ---------------------------------------------------------
   写真
--------------------------------------------------------- */
:is(.engan-kankyo,.okinawa-kankyo) :is(.engan-kankyo-figure,.okinawa-kankyo-figure){
  width:100%;
  margin:0 !important;
  padding:0 !important;
}

:is(.engan-kankyo,.okinawa-kankyo) :is(.engan-kankyo-figure,.okinawa-kankyo-figure) img{
  display:block;
  width:100%;
  height:180px;
  margin:0;
  object-fit:cover;
}

/* ---------------------------------------------------------
   写真下部
   01 ｜ 調査名
--------------------------------------------------------- */
:is(.engan-kankyo,.okinawa-kankyo) :is(.engan-kankyo-figure,.okinawa-kankyo-figure) figcaption{
  display:flex;
  align-items:center;
  min-height:48px;
  margin:0 !important;
  padding:0 12px !important;
  background:#fff;
  box-sizing:border-box;
}

:is(.engan-kankyo,.okinawa-kankyo) :is(.engan-kankyo-number,.okinawa-kankyo-number){
  display:flex;
  flex:0 0 48px;
  align-items:center;
  justify-content:flex-start;
  color:#78b7a4;
  font-size:20px;
  font-weight:700;
  line-height:1;
}

:is(.engan-kankyo,.okinawa-kankyo) :is(.engan-kankyo-title,.okinawa-kankyo-title){
  display:block;
  flex:1;
  min-width:0;
  padding-left:12px;
  border-left:1px solid #b8dcd3;
  color:#222;
  font-size:15px;
  font-weight:700;
  line-height:1.4;
}

/* ---------------------------------------------------------
   マウスオーバー
--------------------------------------------------------- */
:is(.engan-kankyo,.okinawa-kankyo) :is(.engan-kankyo-card,.okinawa-kankyo-card):hover{
  transform:translateY(-2px);
  box-shadow:0 4px 12px rgba(0,0,0,0.10);
}

/* ---------------------------------------------------------
   「業務を見る」との間隔
--------------------------------------------------------- */
:is(.engan-kankyo,.okinawa-kankyo) .dept-work-menu{
  margin-top:22px;
}

/* =========================================================
   沿岸環境部 / 沖縄環境部：タブレット
========================================================= */
@media screen and (max-width:900px){

  :is(.engan-kankyo,.okinawa-kankyo) :is(.engan-kankyo-grid,.okinawa-kankyo-grid){
    grid-template-columns:repeat(2,1fr);
    gap:14px;
  }

  :is(.engan-kankyo,.okinawa-kankyo) :is(.engan-kankyo-card,.okinawa-kankyo-card),
  .engan-kankyo .engan-kankyo-card:nth-child(7),
  .engan-kankyo .engan-kankyo-card:nth-child(8){
    grid-column:auto;
  }

  :is(.engan-kankyo,.okinawa-kankyo) :is(.engan-kankyo-figure,.okinawa-kankyo-figure) img{
    height:170px;
  }

}

/* =========================================================
   沿岸環境部 / 沖縄環境部：スマホ
========================================================= */
@media screen and (max-width:600px){

  :is(.engan-kankyo,.okinawa-kankyo){
    scroll-margin-top:60px;
  }

  :is(.engan-kankyo,.okinawa-kankyo) :is(.engan-kankyo-work,.okinawa-kankyo-work){
    margin-top:10px;
  }

  :is(.engan-kankyo,.okinawa-kankyo) :is(.engan-kankyo-heading,.okinawa-kankyo-heading){
    margin-bottom:10px !important;
    padding-bottom:5px !important;
    font-size:16px;
  }

  :is(.engan-kankyo,.okinawa-kankyo) :is(.engan-kankyo-grid,.okinawa-kankyo-grid){
    grid-template-columns:1fr;
    gap:12px;
  }

  :is(.engan-kankyo,.okinawa-kankyo) :is(.engan-kankyo-card,.okinawa-kankyo-card),
  .engan-kankyo .engan-kankyo-card:nth-child(7),
  .engan-kankyo .engan-kankyo-card:nth-child(8){
    grid-column:auto;
  }

  :is(.engan-kankyo,.okinawa-kankyo) :is(.engan-kankyo-figure,.okinawa-kankyo-figure) img{
    height:auto;
    aspect-ratio:16 / 9;
    object-fit:cover;
  }

  :is(.engan-kankyo,.okinawa-kankyo) :is(.engan-kankyo-figure,.okinawa-kankyo-figure) figcaption{
    min-height:44px;
    padding:0 10px !important;
  }

  :is(.engan-kankyo,.okinawa-kankyo) :is(.engan-kankyo-number,.okinawa-kankyo-number){
    flex:0 0 42px;
    font-size:18px;
  }

  :is(.engan-kankyo,.okinawa-kankyo) :is(.engan-kankyo-title,.okinawa-kankyo-title){
    padding-left:10px;
    font-size:14px;
  }

  :is(.engan-kankyo,.okinawa-kankyo) .dept-work-menu{
    margin-top:16px;
  }

}
/* =========================================================
   河川環境部
========================================================= */
.kasen-kankyo{
  scroll-margin-top:80px;
}

.kasen-kankyo .dept-work{
  width:100%;
  margin-top:10px;
}

/* ---------------------------------------------------------
   業務一覧
--------------------------------------------------------- */
.kasen-kankyo .dept-work-nav{
  display:flex;
  flex-direction:column;
  width:100%;
  margin:0 !important;
  padding:0 !important;
}

.kasen-kankyo .dept-work-item{
  display:grid !important;
  grid-template-columns:52px 250px 1fr;
  align-items:center;
  width:100%;
  margin:0 !important;
  padding:7px 0 !important;
  border-bottom:1px solid #e5e5e5;
  box-sizing:border-box;
}

.kasen-kankyo .dept-work-number-box{
  display:block !important;
  padding:0 !important;
  color:#78b7a4;
  font-size:25px;
  font-weight:700;
  text-align:center;
}

.kasen-kankyo .dept-work-main{
  display:contents;
}


.kasen-kankyo .dept-work-title-box{
  margin:0 !important;
  padding:0 12px !important;
  font-size:21px;
  font-weight:700;
  line-height:1.5;
  white-space:nowrap;
}

.kasen-kankyo .dept-work-description-box{
  margin:0 !important;
  padding:0 12px !important;
  color:#555;
  font-size:12px;
  line-height:1.5;
}

/* ---------------------------------------------------------
   作業事例画像
--------------------------------------------------------- */
.kasen-kankyo .dept-work-visual{
  width:100%;
  margin-top:18px;
}

.kasen-kankyo .dept-work-figure{
  width:100%;
  margin:0 !important;
  padding:0 !important;
}

.kasen-kankyo .dept-work-figure img{
  display:block;
  width:100%;
  height:auto;
  margin:0 auto;
}

/* =========================================================
   河川環境部：スマホ
========================================================= */
@media screen and (max-width:600px){

  .kasen-kankyo{
    scroll-margin-top:60px;
  }

  .kasen-kankyo .dept-work-number-box{
    flex:0 0 48px;
    padding:6px 4px !important;
    font-size:17px;
  }

  .kasen-kankyo .dept-work-title-box{
    padding:4px 8px 1px !important;
    font-size:14px;
  }

  .kasen-kankyo .dept-work-description-box{
    padding:1px 8px 5px !important;
    font-size:11px;
    line-height:1.45;
  }

  .kasen-kankyo .dept-work-visual{
    margin-top:14px;
  }

}

/* =========================================================
   防災系事業部TOP：2枚組スライダー
   切替時にページが上下しないよう表示領域を固定
========================================================= */

/* ---------------------------------------------------------
   スライダー全体
   高さを固定して切替時のレイアウト移動を防止
--------------------------------------------------------- */
.bousai-group-top .bousai-top-slider{
  position:relative;
  width:100%;
  height:760px;
  margin:40px auto 0;
  padding:0;
  box-sizing:border-box;
}

/* ---------------------------------------------------------
   各スライド
   同じ位置・同じ高さに重ねて配置
--------------------------------------------------------- */
.bousai-group-top .bousai-top-slide{
  position:absolute;
  top:0;
  left:0;
  display:flex;
  flex-direction:column;
  align-items:center;
  width:100%;
  height:100%;
  margin:0;
  padding:0;
  gap:28px;
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  box-sizing:border-box;
  transition:opacity .7s ease;
}

/* ---------------------------------------------------------
   表示中のスライド
--------------------------------------------------------- */
.bousai-group-top .bousai-top-slide.is-active{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
}

/* ---------------------------------------------------------
   各写真ブロック
   1枚ごとの高さも固定
--------------------------------------------------------- */
.bousai-group-top .bousai-top-photo{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:flex-start;
  width:100%;
  height:350px;
  margin:0 !important;
  padding:0 !important;
  box-sizing:border-box;
}

/* ---------------------------------------------------------
   写真
   枠内に収めて縦横比は維持
--------------------------------------------------------- */
.bousai-group-top .bousai-top-photo img{
  display:block;
  width:auto;
  max-width:100%;
  height:auto;
  max-height:320px;
  margin:0 auto !important;
  padding:0 !important;
  object-fit:contain;
}

/* ---------------------------------------------------------
   写真キャプション
--------------------------------------------------------- */
.bousai-group-top .bousai-top-photo figcaption{
  width:100%;
  margin:8px 0 0;
  padding:0;
  color:#555;
  font-size:14px;
  line-height:1.5;
  text-align:center;
}

/* =========================================================
   防災系事業部TOP：3スライド目だけ拡大率を調整
   既存仕様を維持
========================================================= */
.bousai-group-top .bousai-top-slide:nth-child(3) .bousai-top-photo img{
  width:75%;
  max-width:75%;
}


/* =========================================================
   防災系事業部TOP：スライド位置ドット
========================================================= */

/* 写真2枚の下にドットを固定 */
.bousai-group-top .bousai-top-dots{
  position:absolute !important;
  z-index:10;
  top:auto !important;
  bottom:-30px !important;
  left:50% !important;
  display:flex !important;
  align-items:center;
  justify-content:center;
  width:auto !important;
  height:20px;
  margin:0 !important;
  padding:0 !important;
  gap:10px;
  transform:translateX(-50%);
}

/* 通常のドット */
.bousai-group-top .bousai-top-dot{
  display:block !important;
  flex:0 0 8px;
  width:8px !important;
  height:8px !important;
  min-width:8px !important;
  min-height:8px !important;
  margin:0 !important;
  padding:0 !important;
  background:#ccc !important;
  border:none !important;
  border-radius:50% !important;
  box-shadow:none !important;
  cursor:pointer;
}

/* 現在表示中のドット */
.bousai-group-top .bousai-top-dot.is-active{
  background:#df958e !important;
}

/* スマホでは写真下の間隔を少し狭くする */
@media screen and (max-width:600px){
  .bousai-group-top .bousai-top-dots{
    bottom:-25px !important;
    gap:8px;
  }
}

/* =========================================================
   防災系事業部TOP：スマホ
========================================================= */
@media screen and (max-width:600px){

  /* -------------------------------------------------------
     スライダー全体
     スマホでも高さを固定
  ------------------------------------------------------- */
  .bousai-group-top .bousai-top-slider{
    width:100%;
    height:430px;
    margin:30px 0 0;
  }

  /* -------------------------------------------------------
     各スライド
  ------------------------------------------------------- */
  .bousai-group-top .bousai-top-slide,
  .bousai-group-top .bousai-top-slide:nth-child(even){
    display:flex;
    flex-direction:column;
    align-items:center;
    width:100%;
    height:100%;
    gap:14px;
  }

  /* -------------------------------------------------------
     各写真ブロック
  ------------------------------------------------------- */
  .bousai-group-top .bousai-top-photo{
    width:100%;
    height:190px;
  }

  /* -------------------------------------------------------
     写真
  ------------------------------------------------------- */
  .bousai-group-top .bousai-top-photo img{
    width:auto;
    max-width:100%;
    height:auto;
    max-height:165px;
    object-fit:contain;
  }

  /* 3スライド目の既存拡大率を維持 */
  .bousai-group-top .bousai-top-slide:nth-child(3) .bousai-top-photo img{
    width:75%;
    max-width:75%;
  }

  /* -------------------------------------------------------
     キャプション
  ------------------------------------------------------- */
  .bousai-group-top .bousai-top-photo figcaption{
    margin-top:6px;
    font-size:12px;
  }

  /* -------------------------------------------------------
     ページ送りの丸
  ------------------------------------------------------- */
  .bousai-group-top .bousai-top-dots{
    margin-top:14px;
    gap:8px;
  }
}

/* =========================================================
   環境解析部
========================================================= */
.kankyo-kaiseki{
  scroll-margin-top:80px;
}

.kankyo-kaiseki .dept-work{
  width:100%;
  margin-top:10px;
}

.kankyo-kaiseki .dept-work-guide{
  margin:0 0 10px !important;
  padding:0 !important;
  color:#666;
  font-size:16px;
  line-height:1.7;
}

.kankyo-kaiseki .dept-work-nav{
  display:flex;
  flex-direction:column;
  width:100%;
  margin:0 !important;
  padding:0 !important;
  gap:0 !important;
}

.kankyo-kaiseki .dept-work-item{
  position:relative;
  display:flex !important;
  align-items:stretch;
  width:100%;
  margin:0 !important;
  padding:0 !important;
  background:transparent;
  border:1px solid transparent;
  color:#222;
  text-align:left;
  cursor:pointer;
  box-sizing:border-box;
}

.kankyo-kaiseki .dept-work-number-box{
  display:flex !important;
  flex:0 0 64px;
  align-items:center;
  justify-content:center;
  padding:12px 8px !important;
  color:#f08d78;
  font-size:20px;
  font-weight:700;
}

.kankyo-kaiseki .dept-work-main{
  flex:1;
  min-width:0;
}

.kankyo-kaiseki .dept-work-title-box{
  padding:8px 14px 3px !important;
  font-size:18px;
  font-weight:700;
}

.kankyo-kaiseki .dept-work-description-box{
  padding:3px 14px 8px !important;
  color:#555;
  font-size:16px;
  line-height:1.55;
}

.kankyo-kaiseki .dept-work-item:hover{
  background:#fff7f4;
  border-color:#f08d78;
}
.kankyo-kaiseki .dept-work-item.is-active{
  background:#fff7f4;
  border-color:#f08d78;
}
.kankyo-kaiseki .dept-work-visual{
  width:100%;
  margin-top:24px;
}

.kankyo-kaiseki .dept-work-panel{
  display:none;
}

.kankyo-kaiseki .dept-work-panel.is-active{
  display:block;
}

.kankyo-kaiseki .dept-work-figure{
  margin:0 !important;
}

.kankyo-kaiseki .dept-work-figure img{
  display:block;
  width:100%;
  height:auto;
  margin:0 auto;
}

.kankyo-kaiseki .dept-work-figure figcaption{
  margin-top:10px;
  color:#555;
  font-size:13px;
  text-align:center;
}

/* =========================================================
   防災解析部
========================================================= */
.bousai-kaiseki{
  scroll-margin-top:80px;
}

.bousai-kaiseki hgroup[is="xb-t"]{
  margin-bottom:20px !important;
}

.bousai-kaiseki .bousai-work{
  width:100%;
  max-width:860px;
  margin:-60px auto 0 !important;
}

/* ---------------------------------------------------------
   タブ
--------------------------------------------------------- */
.bousai-kaiseki .bousai-work-tabs{
  display:flex !important;
  gap:36px !important;
  width:100%;
  margin:0 0 18px !important;
}

.bousai-kaiseki .bousai-work-tabs > p{
  display:contents !important;
}

.bousai-kaiseki .bousai-work-tab{
  flex:1 1 0;
  width:calc(50% - 18px);
  padding:10px 8px 9px;
  background:transparent !important;
  border:none !important;
  border-bottom:1px solid #ccc !important;
  color:#888 !important;
  font-size:20px;
  font-weight:700;
  text-align:center;
  cursor:pointer;
}

.bousai-kaiseki
.bousai-work-tab[data-tab="bousai-simulation"].is-active{
  color:#ef765d !important;
  border-bottom:2px solid #ef765d !important;
}

.bousai-kaiseki
.bousai-work-tab[data-tab="bousai-data-analysis"].is-active{
  color:#4f8fc8 !important;
  border-bottom:2px solid #4f8fc8 !important;
}

/* ---------------------------------------------------------
   説明文
--------------------------------------------------------- */
.bousai-kaiseki .bousai-work-description-area{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:36px;
  margin-bottom:16px;
}

.bousai-kaiseki .bousai-work-description-panel{
  display:none;
}

.bousai-kaiseki #bousai-simulation-description{
  grid-column:1;
}

.bousai-kaiseki #bousai-data-analysis-description{
  grid-column:2;
}

.bousai-kaiseki .bousai-work-description-panel.is-active{
  display:block;
}

.bousai-kaiseki .bousai-work-description-panel p{
  margin:0 !important;
  font-size:14px;
  line-height:1.9;
}

/* ---------------------------------------------------------
   業務一覧
--------------------------------------------------------- */

/* ---------------------------------------------------------
   業務一覧：タブごとの表示切替
--------------------------------------------------------- */
/* 選択されていない業務一覧を非表示 */
.bousai-kaiseki .bousai-work-fields-panel{
  display:none;
}

/* 選択中の業務一覧のみ表示 */
.bousai-kaiseki .bousai-work-fields-panel.is-active{
  display:block;
}

.bousai-kaiseki .bousai-work-fields{
  display:grid !important;
  grid-template-columns:1fr 1fr !important;
  column-gap:36px !important;
  row-gap:0 !important;
  width:100% !important;
  margin:0 !important;
  padding:0 !important;
  box-sizing:border-box !important;
}

/* WordPressが自動挿入するpタグをGridから除外 */
.bousai-kaiseki .bousai-work-fields > p{
  display:none !important;
}

.bousai-kaiseki .bousai-work-fields-column{
  display:block !important;
  min-width:0;
  margin:0 !important;
  padding:0 !important;
  box-sizing:border-box;
}

.bousai-kaiseki .bousai-work-item{
  display:flex;
  align-items:center;
  min-height:52px;
  padding:15px 0;
  border-bottom:1px solid #ddd;
  box-sizing:border-box;
}

.bousai-kaiseki .bousai-work-mark{
  display:flex;
  flex:0 0 32px;
  align-items:center;
  justify-content:center;
  width:32px;
  color:#ef765d;
}

.bousai-kaiseki .bousai-work-mark::before{
  content:"";
  width:0;
  height:0;
  border-top:5px solid transparent;
  border-bottom:5px solid transparent;
  border-left:9px solid currentColor;
}

.bousai-kaiseki .bousai-work-text{
  flex:1;
  min-width:0;
}

.bousai-kaiseki .bousai-work-text h4{
  margin:0 !important;
  padding:0 !important;
  font-size:17px;
  font-weight:700;
  line-height:1.45;
}
/* ---------------------------------------------------------
   画像
--------------------------------------------------------- */
.bousai-kaiseki .bousai-work-image-area{
  width:100%;
  margin-top:32px;
}

.bousai-kaiseki .bousai-work-image-panel{
  display:none;
  width:100%;
}

.bousai-kaiseki .bousai-work-image-panel.is-active{
  display:block;
}

.bousai-kaiseki .bousai-work-main-figure{
  width:100%;
  margin:0 !important;
  padding:0 !important;
}

.bousai-kaiseki .bousai-work-main-figure img{
  display:block;
  width:100%;
  max-width:none;
  height:auto;
  margin:0 auto;
}
/* =========================================================
   構造解析部
========================================================= */
.kouzo-kaiseki{
  scroll-margin-top:80px;
}

.kouzo-kaiseki hgroup[is="xb-t"]{
  margin-bottom:20px !important;
}

.kouzo-kaiseki .kouzo-work{
  width:100%;
  max-width:860px;
  margin:-80px auto 0 !important;
  padding:0;
  box-sizing:border-box;
}

/* ---------------------------------------------------------
   3分類タブ
--------------------------------------------------------- */
.kouzo-kaiseki .kouzo-work-tabs{
  display:flex !important;
  flex-direction:row !important;
  align-items:flex-end !important;
  justify-content:space-between !important;
  gap:22px !important;
  width:100% !important;
  margin:0 0 18px !important;
  padding:0 !important;
  box-sizing:border-box;
}

.kouzo-kaiseki .kouzo-work-tabs > p{
  display:contents !important;
}

.kouzo-kaiseki .kouzo-work-tab{
  display:block !important;
  flex:1 1 0 !important;
  width:calc((100% - 44px) / 3) !important;
  margin:0 !important;
  padding:10px 5px 9px !important;
  appearance:none;
  -webkit-appearance:none;
  background:transparent !important;
  border:none !important;
  border-bottom:1px solid #ccc !important;
  color:#888 !important;
  font-size:20px;
  font-weight:700;
  line-height:1.4;
  text-align:center;
  cursor:pointer;
  box-sizing:border-box;
}

.kouzo-kaiseki
.kouzo-work-tab[data-tab="kouzo-hydraulic"].is-active{
  color:#4f8fc8 !important;
  border-bottom:2px solid #4f8fc8 !important;
}

.kouzo-kaiseki
.kouzo-work-tab[data-tab="kouzo-simulation"].is-active{
  color:#4f8fc8 !important;
  border-bottom:2px solid #4f8fc8 !important;
}

.kouzo-kaiseki
.kouzo-work-tab[data-tab="kouzo-digital"].is-active{
  color:#4f8fc8 !important;
  border-bottom:2px solid #4f8fc8 !important;
}

/* ---------------------------------------------------------
   3列の業務一覧
--------------------------------------------------------- */
.kouzo-kaiseki .kouzo-work-fields{
  display:grid !important;
  grid-template-columns:repeat(3,1fr) !important;
  column-gap:22px !important;
  width:100%;
  margin:0 !important;
  padding:0 !important;
  box-sizing:border-box;
}

.kouzo-kaiseki .kouzo-work-fields > p{
  display:none !important;
}

.kouzo-kaiseki .kouzo-work-fields-column{
  min-width:0;
}

/* ---------------------------------------------------------
   各業務
--------------------------------------------------------- */
.kouzo-kaiseki .kouzo-work-item{
  display:flex;
  align-items:center;
  width:100%;
  padding:17px 0;
  border-bottom:1px solid #ddd;
  box-sizing:border-box;
}

.kouzo-kaiseki .kouzo-work-mark{
  display:flex;
  flex:0 0 25px;
  align-items:center;
  justify-content:center;
  width:25px;
  font-size:0;
}

.kouzo-kaiseki .kouzo-work-mark::before{
  content:"";
  width:0;
  height:0;
  border-top:5px solid transparent;
  border-bottom:5px solid transparent;
  border-left:8px solid currentColor;
}

.kouzo-kaiseki
.kouzo-work-fields-column:nth-child(1)
.kouzo-work-mark{
  color:#ef765d;
}

.kouzo-kaiseki
.kouzo-work-fields-column:nth-child(2)
.kouzo-work-mark{
  color:#4f8fc8;
}

.kouzo-kaiseki
.kouzo-work-fields-column:nth-child(3)
.kouzo-work-mark{
  color:#4f8fc8;
}

.kouzo-kaiseki .kouzo-work-text{
  flex:1;
  min-width:0;
}

.kouzo-kaiseki .kouzo-work-text h4{
  margin:0 !important;
  padding:0 !important;
  color:#222;
  font-size:15px;
  font-weight:700;
  line-height:1.5;
}


/* =========================================================
   構造解析部：選択タブと業務一覧の色を連動
========================================================= */

/* 非選択：すべての列をグレーに */
.kouzo-kaiseki .kouzo-work-fields-column .kouzo-work-text h4{
  color:#aaa !important;
}
.kouzo-kaiseki .kouzo-work-fields-column .kouzo-work-mark{
  color:#bbb !important;
}

/* 3D-CADデータ活用：左列のみ色付け */
.kouzo-kaiseki:has(.kouzo-work-tab[data-tab="kouzo-hydraulic"].is-active) .kouzo-work-fields-column:nth-child(1) .kouzo-work-text h4{
  color:#222 !important;
}
.kouzo-kaiseki:has(.kouzo-work-tab[data-tab="kouzo-hydraulic"].is-active) .kouzo-work-fields-column:nth-child(1) .kouzo-work-mark{
  color:#4f8fc8 !important;
}

/* 数値シミュレーション：中央列のみ色付け */
.kouzo-kaiseki:has(.kouzo-work-tab[data-tab="kouzo-simulation"].is-active) .kouzo-work-fields-column:nth-child(2) .kouzo-work-text h4{
  color:#222 !important;
}
.kouzo-kaiseki:has(.kouzo-work-tab[data-tab="kouzo-simulation"].is-active) .kouzo-work-fields-column:nth-child(2) .kouzo-work-mark{
  color:#4f8fc8 !important;
}

/* 水理模型実験：右列のみ色付け */
.kouzo-kaiseki:has(.kouzo-work-tab[data-tab="kouzo-digital"].is-active) .kouzo-work-fields-column:nth-child(3) .kouzo-work-text h4{
  color:#222 !important;
}
.kouzo-kaiseki:has(.kouzo-work-tab[data-tab="kouzo-digital"].is-active) .kouzo-work-fields-column:nth-child(3) .kouzo-work-mark{
  color:#4f8fc8 !important;
}

/* ---------------------------------------------------------
   写真・解析図エリア
--------------------------------------------------------- */
.kouzo-kaiseki .kouzo-work-image-area{
  width:100%;
  margin:30px 0 0;
  padding:0;
  box-sizing:border-box;
}

.kouzo-kaiseki .kouzo-work-image-panel{
  display:none;
  width:100%;
  margin:0;
  padding:0;
  box-sizing:border-box;
}

.kouzo-kaiseki .kouzo-work-image-panel.is-active{
  display:block;
}

.kouzo-kaiseki .kouzo-work-wide-figure{
  width:100%;
  margin:0 !important;
  padding:0 !important;
}

.kouzo-kaiseki .kouzo-work-wide-figure img{
  display:block;
  width:100%;
  height:auto;
  margin:0 auto;
}

.kouzo-kaiseki .kouzo-work-split-caption{
  display:grid;
  grid-template-columns:1fr 1fr;
  width:100%;
  margin-top:8px;
}

.kouzo-kaiseki .kouzo-work-split-caption span{
  display:block;
  width:100%;
  color:#555;
  font-size:13px;
  line-height:1.6;
  text-align:center;
}

/* ---------------------------------------------------------
   写真2枚横並び
--------------------------------------------------------- */
.kouzo-kaiseki .kouzo-work-gallery{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:26px;
  width:100%;
  margin:0;
  padding:0;
  box-sizing:border-box;
}

/* ---------------------------------------------------------
   写真
--------------------------------------------------------- */
/* ---------------------------------------------------------
   構造解析部：横長画像＋左右別キャプション
--------------------------------------------------------- */
.kouzo-kaiseki .kouzo-work-wide-figure{
  width:100%;
  margin:0 !important;
  padding:0 !important;
}

.kouzo-kaiseki .kouzo-work-wide-figure img{
  display:block;
  width:100%;
  height:auto;
  margin:0 !important;
  padding:0 !important;
}

.kouzo-kaiseki .kouzo-work-split-caption{
  display:flex !important;
  width:100% !important;
  margin:8px 0 0 !important;
  padding:0 !important;
}

.kouzo-kaiseki .kouzo-work-split-caption span{
  display:block !important;
  width:50% !important;
  margin:0 !important;
  padding:0 !important;
  color:#555;
  font-size:13px;
  line-height:1.5;
  text-align:center !important;
  white-space:nowrap;
}

.kouzo-kaiseki .kouzo-work-split-caption span{
  display:block !important;
  margin:0 !important;
  padding:0 !important;
  color:#555;
  font-size:13px;
  line-height:1.5;
  text-align:center;
}
/* =========================================================
   調査解析部
========================================================= */
.chousa-kaiseki{
  scroll-margin-top:80px;
}

/* ★ 760px → 860px に拡大 */
.chousa-kaiseki .dept-work{
  width:100%;
  max-width:860px;
  margin:-50px auto 0;
}

/* ★ 左右の表も860pxまで広げる */
.chousa-kaiseki .chousa-work-layout{
  display:grid !important;
  grid-template-columns:1fr 118px 1fr !important;
  align-items:stretch !important;
  column-gap:24px !important;
  width:100% !important;
  max-width:860px !important;
  margin:0 auto !important;
  padding:0 !important;
  box-sizing:border-box !important;
}

/* WordPressが自動挿入するpタグをGridから除外 */
.chousa-kaiseki .chousa-work-layout > p{
  display:none !important;
}

.chousa-kaiseki .chousa-work-column{
  display:block !important;
  position:relative;
  min-width:0;
  margin:0 !important;
  padding:0 !important;
  background:transparent !important;
  border:none !important;
  box-sizing:border-box;
}

/* ★ 見出しを大きく */
.chousa-kaiseki .chousa-work-heading-row{
  display:flex;
  align-items:center;
  min-height:44px;
  padding-bottom:6px;
  cursor:pointer;
}

.chousa-kaiseki .chousa-work-heading-row h3{
  margin:0 !important;
  color:#888 !important;
  font-size:24px !important;
  font-weight:700;
  line-height:1.4;
}

.chousa-kaiseki .chousa-work-survey .chousa-work-heading-row{
  border-bottom:1px solid #ef765d;
}

.chousa-kaiseki .chousa-work-analysis .chousa-work-heading-row{
  border-bottom:1px solid #4f8fc8;
}

.chousa-kaiseki
.chousa-work-survey
.chousa-work-heading-row.is-active h3{
  color:#ef765d !important;
}

.chousa-kaiseki
.chousa-work-analysis
.chousa-work-heading-row.is-active h3{
  color:#4f8fc8 !important;
}

/* 現地調査の注記 */
.chousa-kaiseki .chousa-work-intro-area{
  height:62px;
  padding-top:6px;
}

.chousa-kaiseki .chousa-work-intro{
  margin:0 !important;
  font-size:12px;
  line-height:1.55;
}

/* ★ 表の各行を少し大きく */
.chousa-kaiseki .chousa-work-item{
  display:flex;
  align-items:center;
  min-height:52px;
  padding:15px 0;
  border-bottom:1px solid #ddd;
  box-sizing:border-box;
}

/* ★ 三角もほんの少し大きく */
.chousa-kaiseki .chousa-work-mark{
  display:flex;
  flex:0 0 32px;
  align-items:center;
  justify-content:center;
  width:32px;
}

.chousa-kaiseki .chousa-work-mark::before{
  content:"";
  width:0;
  height:0;
  border-top:5px solid transparent;
  border-bottom:5px solid transparent;
  border-left:9px solid currentColor;
}

.chousa-kaiseki .chousa-work-survey .chousa-work-mark{
  color:#ef765d;
}

.chousa-kaiseki .chousa-work-analysis .chousa-work-mark{
  color:#4f8fc8;
}

/* ★ 業務名を16px → 17px */
.chousa-kaiseki .chousa-work-text{
  flex:1 1 auto;
  min-width:0;
}

.chousa-kaiseki .chousa-work-text h4{
  margin:0 !important;
  padding:0 !important;
  font-size:17px;
  font-weight:700;
  line-height:1.45;
}

/* ---------------------------------------------------------
   中央
--------------------------------------------------------- */
.chousa-kaiseki .chousa-work-connect{
  position:relative;
  display:flex;
  align-items:center;
  justify-content:center;
}

.chousa-kaiseki .chousa-work-connect-line{
  position:absolute;
  top:0;
  bottom:0;
  left:50%;
  width:1px;
  background:#4f8fc8;
}

/* 円は今のバランスを維持 */
.chousa-kaiseki .chousa-work-connect-circle{
  position:relative;
  z-index:2;
  display:flex;
  align-items:center;
  justify-content:center;
  width:110px;
  height:110px;
  background:#fff;
  border:2px solid #213b5d;
  border-radius:50%;
}

.chousa-kaiseki .chousa-work-connect-circle p{
  margin:0 !important;
  text-align:center;
  font-size:16px;
  font-weight:700;
}

/* ---------------------------------------------------------
   中央：円周に沿う矢印
--------------------------------------------------------- */
.chousa-kaiseki .chousa-work-connect-arrow{
  position:absolute;
  z-index:5;
  display:block;
  width:18px;
  height:18px;
  background:#4f8fc8;
  clip-path:polygon(0 0,100% 50%,0 100%);
}

/* 左上 */
.chousa-kaiseki .chousa-work-connect-arrow-left{
  top:10px;
  left:7px;
  transform:rotate(70deg);
}

/* 右下 */
.chousa-kaiseki .chousa-work-connect-arrow-right{
  right:7px;
  bottom:10px;
  transform:rotate(250deg);
}

/* ---------------------------------------------------------
   写真
--------------------------------------------------------- */
.chousa-kaiseki .chousa-work-visual{
  margin-top:32px;
}

.chousa-kaiseki .chousa-work-group-visual{
  display:none;
}

.chousa-kaiseki .chousa-work-group-visual.is-active{
  display:block;
}

.chousa-kaiseki .chousa-work-gallery{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:26px 18px;
}

.chousa-kaiseki .chousa-work-gallery-item{
  margin:0 !important;
}

.chousa-kaiseki .chousa-work-gallery-item img{
  display:block;
  width:100%;
  height:220px;
  object-fit:contain;
}

.chousa-kaiseki .chousa-work-gallery-item figcaption{
  margin-top:9px;
  color:#555;
  font-size:13px;
  text-align:center;
}

.chousa-kaiseki .chousa-work-gallery-item.is-single{
  grid-column:1 / -1;
  width:100%;
  max-width:520px;
  margin:0 auto !important;
}

/* =========================================================
   スマホ
========================================================= */
@media screen and (max-width:600px){

  .kankyo-kaiseki,
  .bousai-kaiseki,
  .kouzo-kaiseki,
  .chousa-kaiseki{
    scroll-margin-top:60px;
  }

  /* 防災解析 */
  .bousai-kaiseki .bousai-work-tabs{
    gap:15px !important;
  }

  .bousai-kaiseki .bousai-work-tab{
    font-size:15px;
  }

  .bousai-kaiseki .bousai-work-fields{
    grid-template-columns:1fr !important;
  }

  /* 構造解析 */
  .kouzo-kaiseki .kouzo-work{
    width:100%;
  }

  .kouzo-kaiseki .kouzo-work-tabs{
    flex-direction:column !important;
    gap:8px !important;
  }

  .kouzo-kaiseki .kouzo-work-tab{
    width:100% !important;
    flex:none !important;
    font-size:15px;
  }

  .kouzo-kaiseki .kouzo-work-fields{
    grid-template-columns:1fr !important;
  }

  .kouzo-kaiseki .kouzo-work-gallery{
    grid-template-columns:1fr;
    gap:20px;
  }

  .kouzo-kaiseki .kouzo-work-figure img{
    height:auto;
  }

  /* 調査解析 */
  .chousa-kaiseki .dept-work{
    max-width:100%;
  }

  .chousa-kaiseki .chousa-work-layout{
    grid-template-columns:1fr !important;
    row-gap:28px !important;
    max-width:100% !important;
  }

  .chousa-kaiseki .chousa-work-heading-row h3{
    font-size:20px !important;
  }

  .chousa-kaiseki .chousa-work-item{
    min-height:0;
    padding:12px 0;
  }

  .chousa-kaiseki .chousa-work-text h4{
    font-size:14px;
  }

  .chousa-kaiseki .chousa-work-connect{
    min-height:140px;
  }

  .chousa-kaiseki .chousa-work-connect-circle{
    width:96px;
    height:96px;
  }

  .chousa-kaiseki .chousa-work-gallery{
    grid-template-columns:1fr;
  }
}

/* =========================================================
   構造系事業部
========================================================= */
/* =========================================================
   構造系事業部
========================================================= */

/* =========================================================
   構造系事業部TOP
========================================================= */
.kouzou-group-top{
  width:100%;
}

/* ---------------------------------------------------------
   タイトル・説明文
--------------------------------------------------------- */
.kouzou-group-top > div > h1{
  width:100%;
  margin:0 0 16px !important;
}

.kouzou-group-top > div > p{
  width:100%;
  margin:0 0 28px !important;
  color:#444;
  font-size:16px;
  line-height:1.8;
}

/* ---------------------------------------------------------
   TOPスライダー
--------------------------------------------------------- */
.kouzou-group-top .kouzou-top-slider{
  position:relative;
  width:100%;
  height:520px;
  margin:0 auto;
  padding:0;
  box-sizing:border-box;
}

/* ---------------------------------------------------------
   各スライド
   必ず表示領域の中央に固定
--------------------------------------------------------- */
.kouzou-group-top .kouzou-top-slide{
  position:absolute;
  top:0;
  left:50%;
  width:620px;
  height:470px;
  margin:0 !important;
  padding:0 !important;
  opacity:0;
  visibility:hidden;
  transform:translateX(-50%);
  box-sizing:border-box;
  transition:opacity .8s ease;
}

/* 表示中 */
.kouzou-group-top .kouzou-top-slide.is-active{
  z-index:2;
  opacity:1;
  visibility:visible;
}

/* ---------------------------------------------------------
   図面表示領域
--------------------------------------------------------- */
.kouzou-group-top .kouzou-top-photo{
  display:flex !important;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  width:100% !important;
  height:470px;
  margin:0 !important;
  padding:0 !important;
  box-sizing:border-box;
}

/* ---------------------------------------------------------
   図面
   縦横比を維持して中央表示
--------------------------------------------------------- */
.kouzou-group-top .kouzou-top-photo img{
  display:block !important;
  width:auto !important;
  max-width:100% !important;
  height:auto !important;
  max-height:420px !important;
  margin:0 auto !important;
  padding:0 !important;
  object-fit:contain !important;
}

/* ---------------------------------------------------------
   キャプション
--------------------------------------------------------- */
.kouzou-group-top .kouzou-top-photo figcaption{
  display:block;
  width:100%;
  margin:10px 0 0 !important;
  padding:0 !important;
  color:#555;
  font-size:14px;
  line-height:1.6;
  text-align:center;
}

/* ---------------------------------------------------------
   スライダー現在位置
--------------------------------------------------------- */
.kouzou-group-top .kouzou-top-dots{
  position:absolute;
  z-index:5;
  left:50%;
  bottom:15px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  margin:0;
  padding:0;
  transform:translateX(-50%);
}

/* ドット */
.kouzou-group-top .kouzou-top-dot{
  display:block;
  width:8px;
  height:8px;
  margin:0;
  padding:0;
  background:#ccc;
  border:0;
  border-radius:50%;
  cursor:pointer;
}

/* 現在表示中 */
.kouzou-group-top .kouzou-top-dot.is-active{
  background:#666;
}

/* =========================================================
   構造系事業部TOP：タブレット
========================================================= */
@media screen and (max-width:900px){

  .kouzou-group-top .kouzou-top-slider{
    height:480px;
  }

  .kouzou-group-top .kouzou-top-slide{
    width:90%;
    height:430px;
  }

  .kouzou-group-top .kouzou-top-photo{
    height:430px;
  }

  .kouzou-group-top .kouzou-top-photo img{
    max-height:380px !important;
  }

}

/* =========================================================
   構造系事業部TOP：スマホ
========================================================= */
@media screen and (max-width:600px){

  .kouzou-group-top > div > p{
    margin-bottom:20px !important;
    font-size:15px;
    line-height:1.7;
  }

  .kouzou-group-top .kouzou-top-slider{
    height:360px;
  }

  .kouzou-group-top .kouzou-top-slide{
    width:100%;
    height:315px;
  }

  .kouzou-group-top .kouzou-top-photo{
    height:315px;
  }

  .kouzou-group-top .kouzou-top-photo img{
    max-width:100% !important;
    max-height:270px !important;
  }

  .kouzou-group-top .kouzou-top-photo figcaption{
    margin-top:8px !important;
    font-size:12px;
  }

  .kouzou-group-top .kouzou-top-dots{
    bottom:10px;
    gap:8px;
  }

}
/* =========================================================
   構造設計部
========================================================= */
.kozo-sekkei{
  scroll-margin-top:80px;
}

.kozo-sekkei .kozo-work{
  width:100%;
  margin-top:14px;
  box-sizing:border-box;
}

/* ---------------------------------------------------------
   01～03 切替タブ
--------------------------------------------------------- */
.kozo-sekkei .kozo-work-nav{
  display:flex !important;
  align-items:stretch;
  width:100%;
  margin:0 0 18px !important;
  padding:0 !important;
  gap:0 !important;
  border-bottom:1px solid #d9e5ef;
  box-sizing:border-box;
}

.kozo-sekkei .kozo-work-nav > p{
  display:contents !important;
}

.kozo-sekkei .kozo-work-tab{
  display:flex !important;
  flex:1 1 0;
  align-items:center;
  justify-content:center;
  gap:9px;
  min-width:0;
  margin:0 !important;
  padding:10px 8px !important;
  appearance:none;
  -webkit-appearance:none;
  background:transparent !important;
  border:none !important;
  border-bottom:3px solid transparent !important;
  color:#777 !important;
  font-family:inherit;
  cursor:pointer;
  box-sizing:border-box;
  transition:color 0.2s ease,border-color 0.2s ease,background 0.2s ease;
}

.kozo-sekkei .kozo-work-tab:hover{
  background:#f4f9fc !important;
  color:#287eb8 !important;
}

.kozo-sekkei .kozo-work-tab.is-active{
  background:#f4f9fc !important;
  border-bottom-color:#2d8fc5 !important;
  color:#1d6f9f !important;
}

.kozo-sekkei .kozo-work-number{
  flex:0 0 auto;
  color:#69b8df;
  font-size:20px;
  font-weight:700;
  line-height:1;
}

.kozo-sekkei .kozo-work-tab.is-active .kozo-work-number{
  color:#2d8fc5;
}

.kozo-sekkei .kozo-work-tab-title{
  min-width:0;
  font-size:15px;
  font-weight:700;
  line-height:1.4;
  white-space:nowrap;
}

/* ---------------------------------------------------------
   表示パネル
--------------------------------------------------------- */
/* ---------------------------------------------------------
   01～03 切替表示領域
   自動切替時に下のコンテンツが上下しないよう高さを固定
--------------------------------------------------------- */
.kozo-sekkei .kozo-work-panel{
  display:none;
  width:100%;
  height:560px;
  margin:0 !important;
  padding:0 !important;
  box-sizing:border-box;
}

.kozo-sekkei .kozo-work-panel.is-active{
  display:block;
}

/* ---------------------------------------------------------
   各業務の見出し
--------------------------------------------------------- */
.kozo-sekkei .kozo-work-heading{
  display:flex;
  align-items:center;
  width:100%;
  margin:0 0 16px !important;
  padding:0 0 9px !important;
  border-bottom:1px solid #d9e5ef;
  box-sizing:border-box;
}

.kozo-sekkei .kozo-work-heading-number{
  display:flex;
  flex:0 0 52px;
  align-items:center;
  justify-content:center;
  width:52px;
  height:42px;
  margin-right:14px;
  background:#69b8df;
  color:#fff;
  font-size:22px;
  font-weight:700;
  line-height:1;
}

.kozo-sekkei .kozo-work-heading-main{
  display:flex;
  flex:1;
  align-items:center;
  min-width:0;
}

.kozo-sekkei .kozo-work-heading-main h3{
  flex:0 0 auto;
  margin:0 22px 0 0 !important;
  padding:0 !important;
  color:#17385f;
  font-size:21px;
  font-weight:700;
  line-height:1.4;
  white-space:nowrap;
}

.kozo-sekkei .kozo-work-heading-main p{
  flex:1;
  min-width:0;
  margin:0 !important;
  padding:0 !important;
  color:#555;
  font-size:12px;
  line-height:1.6;
}

/* ---------------------------------------------------------
   横方向の業務フロー
   画像 → 画像 → 画像
--------------------------------------------------------- */
.kozo-sekkei .kozo-work-flow{
  display:grid;
  grid-template-columns:minmax(0,1fr) 34px minmax(0,1fr) 34px minmax(0,1.25fr);
  align-items:center;
  width:100%;
  margin:0 !important;
  padding:0 !important;
  gap:8px;
  box-sizing:border-box;
}
/* ---------------------------------------------------------
   01 外殻施設の設計：2枚を大きく表示
--------------------------------------------------------- */
.kozo-sekkei .kozo-work-flow-two{
  grid-template-columns:minmax(0,1fr) 46px minmax(0,1fr);
  gap:14px;
}

.kozo-sekkei .kozo-work-flow-two .kozo-work-figure img{
  width:100%;
  height:270px;
  object-fit:contain;
}

.kozo-sekkei .kozo-work-flow-two .kozo-work-arrow{
  font-size:40px;
}

/* ---------------------------------------------------------
   03 地震応答解析
   上段：解析モデル → 液状化・変形解析
   下段：地震後の岸壁
--------------------------------------------------------- */
.kozo-sekkei .kozo-work-flow-earthquake{
  width:100%;
  margin:0 !important;
  padding:6px 0 0 !important;
  box-sizing:border-box;
}

/* 上段 */
.kozo-sekkei .kozo-work-earthquake-top{
  display:grid;
  grid-template-columns:minmax(0,1fr) 46px minmax(0,1.25fr);
  align-items:center;
  width:100%;
  gap:14px;
  margin:0 !important;
  padding:0 !important;
  box-sizing:border-box;
}

/* 地震応答解析の画像 */
.kozo-sekkei .kozo-work-earthquake-figure{
  display:flex;
  align-items:center;
  justify-content:center;
  min-width:0;
  width:100%;
  margin:0 !important;
  padding:0 !important;
}

.kozo-sekkei .kozo-work-earthquake-figure img{
  display:block;
  width:100%;
  height:210px;
  margin:0 auto;
  object-fit:contain;
}

/* 上段の横矢印 */
.kozo-sekkei .kozo-work-earthquake-arrow-right{
  display:flex;
  align-items:center;
  justify-content:center;
  width:100%;
  color:#626668;
  font-size:40px;
  font-weight:700;
  line-height:1;
}

/* 下方向の矢印 */
.kozo-sekkei .kozo-work-earthquake-arrow-down{
  display:flex;
  align-items:center;
  justify-content:center;
  width:100%;
  height:52px;
  margin:0 !important;
  padding:0 0 0 34% !important;
  color:#626668;
  font-size:48px;
  font-weight:700;
  line-height:1;
  box-sizing:border-box;
}

/* 下段 */
.kozo-sekkei .kozo-work-earthquake-bottom{
  display:flex;
  justify-content:center;
  width:100%;
  margin:0 !important;
  padding:0 !important;
}

/* 岸壁画像 */
.kozo-sekkei .kozo-work-earthquake-result{
  width:58%;
  max-width:500px;
}

.kozo-sekkei .kozo-work-earthquake-result img{
  width:100%;
  height:220px;
  object-fit:contain;
}
.kozo-sekkei .kozo-work-figure{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  min-width:0;
  width:100%;
  margin:0 !important;
  padding:0 !important;
}

.kozo-sekkei .kozo-work-figure img{
  display:block;
  width:100%;
  height:190px;
  margin:0 auto;
  object-fit:contain;
}

.kozo-sekkei .kozo-work-figure figcaption{
  width:100%;
  min-height:24px;
  margin:7px 0 0 !important;
  padding:0 !important;
  color:#444;
  font-size:13px;
  font-weight:500;
  line-height:1.5;
  text-align:center;
}

/* ---------------------------------------------------------
   フロー矢印
--------------------------------------------------------- */
.kozo-sekkei .kozo-work-arrow{
  display:flex;
  align-items:center;
  justify-content:center;
  width:100%;
  color:#7b848a;
  font-size:34px;
  font-weight:700;
  line-height:1;
}

/* ---------------------------------------------------------
   01 外殻施設のメッセージ
--------------------------------------------------------- */
.kozo-sekkei .kozo-work-message{
  width:max-content;
  max-width:100%;
  margin:12px 0 0 auto !important;
  padding:8px 16px !important;
  background:#e8f5fc;
  border-radius:30px;
  color:#174c7b;
  font-size:14px;
  font-weight:700;
  line-height:1.5;
  text-align:center;
  box-sizing:border-box;
}

/* ---------------------------------------------------------
   現在位置 ● ○ ○
--------------------------------------------------------- */
.kozo-sekkei .kozo-work-dots{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:9px;
  width:100%;
  margin:20px 0 0 !important;
  padding:0 !important;
}

.kozo-sekkei .kozo-work-dot{
  display:block;
  width:8px;
  height:8px;
  margin:0;
  padding:0;
  background:#d3d3d3;
  border-radius:50%;
}

.kozo-sekkei .kozo-work-dot.is-active{
  background:#2d8fc5;
}

/* ---------------------------------------------------------
   「業務を見る」との間隔
--------------------------------------------------------- */
.kozo-sekkei .dept-work-menu{
  margin-top:22px;
}

/* =========================================================
   構造設計部：タブレット
========================================================= */
@media screen and (max-width:900px){

  .kozo-sekkei .kozo-work-tab{
    gap:6px;
    padding:9px 5px !important;
  }

  .kozo-sekkei .kozo-work-number{
    font-size:18px;
  }

  .kozo-sekkei .kozo-work-tab-title{
    font-size:13px;
  }

  .kozo-sekkei .kozo-work-heading-main h3{
    margin-right:14px !important;
    font-size:19px;
  }

  .kozo-sekkei .kozo-work-heading-main p{
    font-size:11px;
  }

  .kozo-sekkei .kozo-work-flow{
    grid-template-columns:minmax(0,1fr) 26px minmax(0,1fr) 26px minmax(0,1.2fr);
    gap:5px;
  }

  .kozo-sekkei .kozo-work-figure img{
    height:165px;
  }

  .kozo-sekkei .kozo-work-arrow{
    font-size:28px;
  }

}

/* =========================================================
   構造設計部：スマホ
========================================================= */
@media screen and (max-width:600px){

  .kozo-sekkei{
    scroll-margin-top:60px;
  }

  .kozo-sekkei .kozo-work{
    margin-top:10px;
  }

  /* タブは3つを縦並び */
  .kozo-sekkei .kozo-work-nav{
    flex-direction:column;
    margin-bottom:14px !important;
    border-bottom:none;
  }

  .kozo-sekkei .kozo-work-tab{
    justify-content:flex-start;
    width:100%;
    padding:9px 10px !important;
    border-bottom:1px solid #ddd !important;
  }

  .kozo-sekkei .kozo-work-tab.is-active{
    border-bottom:2px solid #2d8fc5 !important;
  }

  .kozo-sekkei .kozo-work-number{
    width:32px;
    font-size:17px;
  }

  .kozo-sekkei .kozo-work-tab-title{
    font-size:14px;
  }

  /* 見出し */
  .kozo-sekkei .kozo-work-heading{
    align-items:flex-start;
    margin-bottom:12px !important;
    padding-bottom:8px !important;
  }

  .kozo-sekkei .kozo-work-heading-number{
    flex:0 0 44px;
    width:44px;
    height:38px;
    margin-right:10px;
    font-size:18px;
  }

  .kozo-sekkei .kozo-work-heading-main{
    display:block;
  }

  .kozo-sekkei .kozo-work-heading-main h3{
    margin:0 0 3px !important;
    font-size:17px;
    white-space:normal;
  }

  .kozo-sekkei .kozo-work-heading-main p{
    font-size:11px;
    line-height:1.5;
  }

  /* スマホでは工程を縦方向へ */
  .kozo-sekkei .kozo-work-flow{
    display:flex;
    flex-direction:column;
    gap:7px;
  }

  .kozo-sekkei .kozo-work-figure{
    width:100%;
  }

  .kozo-sekkei .kozo-work-figure img{
    width:100%;
    height:auto;
    max-height:230px;
    object-fit:contain;
  }

  .kozo-sekkei .kozo-work-figure figcaption{
    min-height:0;
    margin-top:5px !important;
    font-size:12px;
  }

  /* → を ↓ に見せる */
  .kozo-sekkei .kozo-work-arrow{
    height:24px;
    font-size:0;
  }

  .kozo-sekkei .kozo-work-arrow::before{
    content:"↓";
    color:#2589c4;
    font-size:26px;
    font-weight:700;
    line-height:1;
  }

  .kozo-sekkei .kozo-work-message{
    margin:10px auto 0 !important;
    padding:7px 14px !important;
    font-size:12px;
  }

  .kozo-sekkei .kozo-work-dots{
    margin-top:12px !important;
  }

  .kozo-sekkei .dept-work-menu{
    margin-top:16px;
  }

}

/* =========================================================
   設計技術部
========================================================= */
.sekkei-gijutsu{
  scroll-margin-top:80px;
}

.sekkei-gijutsu .sekkei-gijutsu-work{
  width:100%;
  margin-top:14px;
  box-sizing:border-box;
}

/* ---------------------------------------------------------
   キャッチコピー
--------------------------------------------------------- */
.sekkei-gijutsu .sekkei-gijutsu-catch{
  margin:0 0 22px !important;
  padding:0 !important;
  color:#17385f;
  font-size:20px;
  font-weight:700;
  line-height:1.6;
}

/* ---------------------------------------------------------
   01・02 横並び
--------------------------------------------------------- */
/* ---------------------------------------------------------
   01・02 横並び
--------------------------------------------------------- */
.sekkei-gijutsu .sekkei-gijutsu-grid{
  display:grid !important;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr) !important;
  width:100% !important;
  max-width:none !important;
  margin: 24px 0 0 !important;
  padding:0 !important;
  gap:32px !important;
  box-sizing:border-box !important;
}

.sekkei-gijutsu .sekkei-gijutsu-grid > p{
  display:none !important;
}

.sekkei-gijutsu .sekkei-gijutsu-item{
  display:block !important;
  width:auto !important;
  max-width:none !important;
  min-width:0 !important;
  margin:0 !important;
  padding:0 !important;
  box-sizing:border-box !important;
}

.sekkei-gijutsu .sekkei-gijutsu-item{
  min-width:0;
  margin:0 !important;
  padding:0 !important;
  box-sizing:border-box;
}

/* ---------------------------------------------------------
   各ブロックの見出し
--------------------------------------------------------- */
.sekkei-gijutsu .sekkei-gijutsu-heading{
  display:flex;
  align-items:stretch;
  width:100%;
  min-height:58px;
  margin:0 0 14px !important;
  padding:0 !important;
  border-bottom:2px solid #2d8fc5;
  box-sizing:border-box;
}

.sekkei-gijutsu .sekkei-gijutsu-number{
  display:flex;
  flex:0 0 52px;
  align-items:center;
  justify-content:center;
  width:52px;
  background:#2d8fc5;
  color:#fff;
  font-size:20px;
  font-weight:700;
  line-height:1;
}

.sekkei-gijutsu .sekkei-gijutsu-heading-main{
  display:flex;
  flex:1;
  flex-direction:column;
  justify-content:center;
  min-width:0;
  padding:6px 12px !important;
  box-sizing:border-box;
}

.sekkei-gijutsu .sekkei-gijutsu-heading-main h3{
  margin:0 !important;
  padding:0 !important;
  color:#17385f;
  font-size:18px;
  font-weight:700;
  line-height:1.4;
}

.sekkei-gijutsu .sekkei-gijutsu-heading-main p{
  margin:3px 0 0 !important;
  padding:0 !important;
  color:#5d7891;
  font-size:12px;
  font-weight:500;
  line-height:1.5;
}

/* ---------------------------------------------------------
   写真
--------------------------------------------------------- */
.sekkei-gijutsu .sekkei-gijutsu-figure{
  width:100%;
  margin:0 !important;
  padding:0 !important;
}

.sekkei-gijutsu .sekkei-gijutsu-figure img{
  display:block;
  width:100%;
  height:260px;
  margin:0;
  object-fit:cover;
}

.sekkei-gijutsu .sekkei-gijutsu-figure figcaption{
  margin:7px 0 0 !important;
  padding:0 !important;
  color:#555;
  font-size:13px;
  line-height:1.5;
  text-align:center;
}

/* ---------------------------------------------------------
   説明文
--------------------------------------------------------- */
/* 01・02 説明文 */
.sekkei-gijutsu .sekkei-gijutsu-description{
  margin:14px 0 16px !important;
  padding:0 !important;
  color:#333;
  font-size:19px;
  font-weight:500;
  line-height:1.8;
}

/* ---------------------------------------------------------
   「業務を見る」との間隔
--------------------------------------------------------- */
.sekkei-gijutsu .dept-work-menu{
  margin-top:28px;
}

/* =========================================================
   設計技術部：タブレット
========================================================= */
@media screen and (max-width:900px){

  .sekkei-gijutsu .sekkei-gijutsu-grid{
    gap:22px;
  }

  .sekkei-gijutsu .sekkei-gijutsu-heading-main h3{
    font-size:16px;
  }

  .sekkei-gijutsu .sekkei-gijutsu-figure img{
    height:220px;
  }

}

/* =========================================================
   設計技術部：スマホ
========================================================= */
@media screen and (max-width:600px){

  .sekkei-gijutsu{
    scroll-margin-top:60px;
  }

  .sekkei-gijutsu .sekkei-gijutsu-work{
    margin-top:10px;
  }

  .sekkei-gijutsu .sekkei-gijutsu-catch{
    margin-bottom:16px !important;
    font-size:17px;
  }

  .sekkei-gijutsu .sekkei-gijutsu-grid{
    grid-template-columns:1fr;
    gap:30px;
  }

  .sekkei-gijutsu .sekkei-gijutsu-heading{
    min-height:52px;
    margin-bottom:12px !important;
  }

  .sekkei-gijutsu .sekkei-gijutsu-number{
    flex:0 0 44px;
    width:44px;
    font-size:18px;
  }

  .sekkei-gijutsu .sekkei-gijutsu-heading-main{
    padding:5px 10px !important;
  }

  .sekkei-gijutsu .sekkei-gijutsu-heading-main h3{
    font-size:16px;
  }

  .sekkei-gijutsu .sekkei-gijutsu-heading-main p{
    font-size:11px;
  }

  .sekkei-gijutsu .sekkei-gijutsu-figure img{
    height:auto;
    aspect-ratio:16 / 9;
    object-fit:cover;
  }

  .sekkei-gijutsu .sekkei-gijutsu-figure figcaption{
    font-size:12px;
  }

  .sekkei-gijutsu .sekkei-gijutsu-description{
    margin-top:10px !important;
    font-size:13px;
    line-height:1.8;
  }

  .sekkei-gijutsu .dept-work-menu{
    margin-top:20px;
  }

}

/* =========================================================
   調査設計部
========================================================= */

/* ---------------------------------------------------------
   部門全体
--------------------------------------------------------- */
.tyosa-sekkei{
  scroll-margin-top:80px;
}

/* ---------------------------------------------------------
   キャッチコピー
--------------------------------------------------------- */
.tyosa-sekkei .tyosa-sekkei-catch{
  margin:22px 0 10px !important;
  color:#004b7c;
  font-size:17px;
  font-weight:700;
  line-height:1.7;
}

/* ---------------------------------------------------------
   説明文
--------------------------------------------------------- */
.tyosa-sekkei hgroup p:not(.tyosa-sekkei-catch){
  margin:0 0 6px !important;
  line-height:1.9;
}

/* ---------------------------------------------------------
   UAV測量・水中ドローン調査：説明文
--------------------------------------------------------- */
.tyosa-sekkei .tyosa-sekkei-panel-description{
  width:100%;
  margin:0 0 18px !important;
  padding:0 !important;
  color:#333;
  font-size:15px;
  line-height:1.9;
  box-sizing:border-box;
}

/* ---------------------------------------------------------
   業務紹介エリア
--------------------------------------------------------- */
.tyosa-sekkei .tyosa-sekkei-work{
  width:100%;
  margin-top:28px;
  box-sizing:border-box;
}

/* ---------------------------------------------------------
   01～03 タブ
--------------------------------------------------------- */
.tyosa-sekkei .tyosa-sekkei-nav{
  display:flex;
  align-items:stretch;
  width:100%;
  margin:0 0 18px !important;
  padding:0 !important;
  border-bottom:1px solid #cfd8df;
  box-sizing:border-box;
}

.tyosa-sekkei .tyosa-sekkei-tab{
  position:relative;
  flex:1;
  display:flex;
  align-items:center;
  justify-content:center;
  min-width:0;
  margin:0;
  padding:14px 10px;
  border:0;
  border-bottom:3px solid transparent;
  background:#fff;
  color:#444;
  font:inherit;
  cursor:pointer;
  box-sizing:border-box;
  transition:background-color .25s ease,color .25s ease,border-color .25s ease;
}

.tyosa-sekkei .tyosa-sekkei-tab:hover{
  background:#f5f9fc;
  color:#0078b8;
}

.tyosa-sekkei .tyosa-sekkei-tab.is-active{
  background:#f2f8fc;
  color:#0078b8;
  border-bottom-color:#2496d1;
}

.tyosa-sekkei .tyosa-sekkei-tab-title{
  display:block;
  font-size:15px;
  font-weight:700;
  line-height:1.5;
  text-align:center;
}

/* ---------------------------------------------------------
   自動切替表示領域
   3枚の画像サイズが異なっても高さを変えない
--------------------------------------------------------- */
.tyosa-sekkei .tyosa-sekkei-panel-area{
  position:relative;
  width:100%;
  height:430px;
  margin:0 !important;
  padding:0 !important;
  overflow:hidden;
  box-sizing:border-box;
}

/* ---------------------------------------------------------
   各パネル
--------------------------------------------------------- */
.tyosa-sekkei .tyosa-sekkei-panel{
  display:none;
  width:100%;
  height:100%;
  margin:0 !important;
  padding:0 !important;
  box-sizing:border-box;
}

/* ---------------------------------------------------------
   表示中パネル
   説明文 → 写真 の縦配置
--------------------------------------------------------- */
.tyosa-sekkei .tyosa-sekkei-panel.is-active{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:flex-start;
}

/* ---------------------------------------------------------
   UAV測量・水中ドローン調査：説明文
--------------------------------------------------------- */
.tyosa-sekkei .tyosa-sekkei-panel-description{
  width:100%;
  margin:0 0 18px !important;
  padding:0 !important;
  color:#333;
  font-size:15px;
  line-height:1.9;
  text-align:left;
  box-sizing:border-box;
}

/* ---------------------------------------------------------
   写真表示
--------------------------------------------------------- */
.tyosa-sekkei .tyosa-sekkei-figure{
  display:flex;
  align-items:center;
  justify-content:center;
  width:100%;
  flex:1;
  min-height:0;
  margin:0 !important;
  padding:10px 0 !important;
  box-sizing:border-box;
}

.tyosa-sekkei .tyosa-sekkei-figure img{
  display:block;
  width:auto;
  max-width:88%;
  height:auto;
  max-height:360px;
  margin:0 auto;
  object-fit:contain;
}
/* ---------------------------------------------------------
   写真
--------------------------------------------------------- */
.tyosa-sekkei .tyosa-sekkei-figure{
  display:flex;
  align-items:center;
  justify-content:center;
  width:100%;
  height:100%;
  margin:0 !important;
  padding:10px 0 !important;
  box-sizing:border-box;
}

.tyosa-sekkei .tyosa-sekkei-figure img{
  display:block;
  width:auto;
  max-width:88%;
  height:auto;
  max-height:400px;
  margin:0 auto;
  object-fit:contain;
}

/* ---------------------------------------------------------
   現在位置 ● ○ ○
--------------------------------------------------------- */
.tyosa-sekkei .tyosa-sekkei-dots{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:9px;
  width:100%;
  margin:14px 0 0 !important;
  padding:0 !important;
}

.tyosa-sekkei .tyosa-sekkei-dot{
  display:block;
  width:7px;
  height:7px;
  border-radius:50%;
  background:#d3d3d3;
  transition:background-color .25s ease;
}

.tyosa-sekkei .tyosa-sekkei-dot.is-active{
  background:#2496d1;
}

/* ---------------------------------------------------------
   業務を見る
--------------------------------------------------------- */
.tyosa-sekkei .dept-work-menu{
  margin-top:30px;
}

/* =========================================================
   調査設計部：タブレット
========================================================= */
@media screen and (max-width:900px){

  .tyosa-sekkei .tyosa-sekkei-catch{
    font-size:16px;
  }

  .tyosa-sekkei .tyosa-sekkei-panel-area{
    height:390px;
  }

  .tyosa-sekkei .tyosa-sekkei-figure img{
    max-width:92%;
    max-height:360px;
  }

  .tyosa-sekkei .tyosa-sekkei-tab-title{
    font-size:14px;
  }
}

/* =========================================================
   調査設計部：スマホ
========================================================= */
@media screen and (max-width:600px){

  .tyosa-sekkei{
    scroll-margin-top:60px;
  }

  .tyosa-sekkei .tyosa-sekkei-catch{
    margin-top:16px !important;
    font-size:15px;
  }

  .tyosa-sekkei hgroup p:not(.tyosa-sekkei-catch){
    line-height:1.8;
  }

  .tyosa-sekkei .tyosa-sekkei-work{
    margin-top:20px;
  }

  /* タブは縦並び */
  .tyosa-sekkei .tyosa-sekkei-nav{
    flex-direction:column;
    margin-bottom:14px !important;
    border-bottom:0;
  }

  .tyosa-sekkei .tyosa-sekkei-tab{
    justify-content:flex-start;
    width:100%;
    padding:11px 14px;
    border-bottom:1px solid #d9e1e6;
    text-align:left;
  }

  .tyosa-sekkei .tyosa-sekkei-tab.is-active{
    border-bottom:1px solid #2496d1;
    border-left:4px solid #2496d1;
  }

  .tyosa-sekkei .tyosa-sekkei-tab-title{
    font-size:14px;
    text-align:left;
  }

  /* スマホでは固定高さを解除 */
  .tyosa-sekkei .tyosa-sekkei-panel-area{
    height:auto;
    min-height:0;
    overflow:visible;
  }

  .tyosa-sekkei .tyosa-sekkei-panel{
    height:auto;
  }

  .tyosa-sekkei .tyosa-sekkei-panel.is-active{
    display:block;
  }

  .tyosa-sekkei .tyosa-sekkei-figure{
    height:auto;
    padding:10px 0 !important;
  }

  .tyosa-sekkei .tyosa-sekkei-figure img{
    width:100%;
    max-width:100%;
    height:auto;
    max-height:none;
  }

  .tyosa-sekkei .tyosa-sekkei-dots{
    margin-top:12px !important;
  }

  .tyosa-sekkei .dept-work-menu{
    margin-top:24px;
  }
}

/* =========================================================
   国際事業部
   カラー：ホワイト × クリアオレンジ
========================================================= */
.kokusai-jigyo{
  width:100%;
  scroll-margin-top:80px;
}

/* ---------------------------------------------------------
   部門説明
--------------------------------------------------------- */
.kokusai-jigyo hgroup[is="xb-t"]{
  margin-bottom:42px !important;
}

.kokusai-jigyo hgroup[is="xb-t"] h2{
  margin-bottom:28px !important;
}

.kokusai-jigyo hgroup[is="xb-t"] > p{
  line-height:2;
}

/* =========================================================
   全体
========================================================= */
.kokusai-jigyo .kokusai-work{
  width:100%;
  margin:0;
  padding:0;
  box-sizing:border-box;
}

/* キャッチコピー */
.kokusai-jigyo .kokusai-work-catch{
  margin:0 0 28px !important;
  color:#00518e;
  font-size:16px;
  font-weight:700;
  line-height:1.8;
}

/* =========================================================
   世界地図
========================================================= */
.kokusai-jigyo .kokusai-map-area{
  position:relative;
  width:100%;
  margin:0 auto 28px;
  padding:0;
  box-sizing:border-box;
}

.kokusai-jigyo .kokusai-map-image{
  display:block;
  width:100%;
  height:auto;
  margin:0 auto;
}

/* =========================================================
   世界地図：国別マーカー
========================================================= */
.kokusai-jigyo .kokusai-map-marker{
  position:absolute;
  z-index:5;
  display:flex;
  align-items:center;
  justify-content:center;
  min-width:88px;
  min-height:32px;
  margin:0;
  padding:6px 11px;
  background:#f28a32;
  border-radius:3px;
  color:#fff;
  font-size:12px;
  font-weight:700;
  line-height:1.3;
  white-space:nowrap;
  box-shadow:0 2px 7px rgba(242,138,50,.20);
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transform:translate(-50%,-100%);
  box-sizing:border-box;
  transition:opacity .35s ease;
}

/* 選択中の国だけ表示 */
.kokusai-jigyo .kokusai-map-marker.is-active{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
}

/* マーカー縦線 */
.kokusai-jigyo .kokusai-map-marker::before{
  content:"";
  position:absolute;
  top:100%;
  left:50%;
  width:1px;
  height:18px;
  margin:0;
  padding:0;
  background:#f28a32;
  transform:translateX(-50%);
}

/* マーカー地点 */
.kokusai-jigyo .kokusai-map-marker::after{
  content:"";
  position:absolute;
  top:calc(100% + 18px);
  left:50%;
  width:12px;
  height:12px;
  margin:0;
  padding:0;
  background:#f28a32;
  border:3px solid #f28a32;
  border-radius:50%;
  box-shadow:0 1px 5px rgba(242,138,50,.28);
  transform:translate(-50%,-50%);
  box-sizing:border-box;
}

/* =========================================================
   7か国の位置
   ★確定済み
========================================================= */

/* 01：マダガスカル */
.kokusai-jigyo .kokusai-map-marker[data-country="madagascar"]{
  left:21%;
  top:70.5%;
}

/* 02：キリバス */
.kokusai-jigyo .kokusai-map-marker[data-country="kiribati"]{
  left:51%;
  top:62%;
}

/* 03：セントルシア */
.kokusai-jigyo .kokusai-map-marker[data-country="saintlucia"]{
  left:83%;
  top:57%;
}

/* 04：モザンビーク */
.kokusai-jigyo .kokusai-map-marker[data-country="mozambique"]{
  left:18.5%;
  top:68.5%;
}

/* 05：ガーナ */
.kokusai-jigyo .kokusai-map-marker[data-country="ghana"]{
  left:7.5%;
  top:59%;
}

/* 06：セーシェル */
.kokusai-jigyo .kokusai-map-marker[data-country="seychelles"]{
  left:23.5%;
  top:63%;
}

/* 07：ソロモン諸島 */
.kokusai-jigyo .kokusai-map-marker[data-country="solomon"]{
  left:47.5%;
  top:65.5%;
}

/* =========================================================
   国別切替
========================================================= */
.kokusai-jigyo .kokusai-country-nav{
  display:grid !important;
  grid-template-columns:repeat(4,minmax(0,1fr)) !important;
  width:100% !important;
  margin:0 0 18px !important;
  padding:0 !important;
  gap:0 !important;
  background:#fff;
  border:none;
  box-sizing:border-box;
}

/* WordPress自動挿入対策 */
.kokusai-jigyo .kokusai-country-nav > p,
.kokusai-jigyo .kokusai-country-nav > br{
  display:none !important;
}

/* ---------------------------------------------------------
   国別タブ
   通常：グレー塗り
   右・下に白い境界線
--------------------------------------------------------- */
.kokusai-jigyo .kokusai-country-tab{
  position:relative;
  display:flex !important;
  align-items:center;
  justify-content:center;
  width:100% !important;
  min-width:0 !important;
  height:42px !important;
  margin:0 !important;
  padding:8px 6px !important;
  appearance:none;
  -webkit-appearance:none;
  background:#eeeeee !important;

  /* 縦・横の白い境界線 */
  border:none !important;
  border-right:1px solid #fff !important;
  border-bottom:1px solid #fff !important;

  border-radius:0 !important;
  color:#444 !important;
  font-family:inherit;
  font-size:14px;
  font-weight:700;
  line-height:1.4;
  text-align:center;
  cursor:pointer;
  box-sizing:border-box;
  transition:
    background .25s ease,
    color .25s ease;
}

/* ---------------------------------------------------------
   hover
--------------------------------------------------------- */
.kokusai-jigyo .kokusai-country-tab:hover{
  background:#f8eee5 !important;
  color:#e87922 !important;
}

/* ---------------------------------------------------------
   選択中
--------------------------------------------------------- */
.kokusai-jigyo .kokusai-country-tab.is-active{
  background:#fff1e5 !important;
  color:#df6f18 !important;
}

/* 選択中のオレンジ下線 */
.kokusai-jigyo .kokusai-country-tab.is-active::after{
  content:"";
  position:absolute;
  z-index:2;
  left:0;
  right:0;
  bottom:0;
  height:3px;
  background:#f28a32;
}

/* 選択中の国名の前の小さい○ */
.kokusai-jigyo .kokusai-country-tab.is-active::before{
  content:"";
  display:block;
  flex:0 0 auto;
  width:6px;
  height:6px;
  margin-right:7px;
  background:#f28a32;
  border-radius:50%;
}

/* =========================================================
   国別情報表示領域
========================================================= */
.kokusai-jigyo .kokusai-panel-area{
  position:relative;
  width:100%;
  height:480px;
  margin:0 !important;
  padding:0 !important;
  box-sizing:border-box;
}

.kokusai-jigyo .kokusai-panel-area > p{
  display:none !important;
}

/* 非表示パネル */
.kokusai-jigyo .kokusai-panel{
  position:absolute;
  top:0;
  left:0;
  display:block;
  width:100%;
  height:100%;
  margin:0 !important;
  padding:20px 0 0 !important;
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  box-sizing:border-box;
  transition:opacity .4s ease;
}

/* 表示中パネル */
.kokusai-jigyo .kokusai-panel.is-active{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
}

/* =========================================================
   国別説明
========================================================= */
.kokusai-jigyo .kokusai-panel-description{
  display:block;
  width:100%;
  margin:0 0 16px !important;
  padding:0 !important;
  box-sizing:border-box;
}

.kokusai-jigyo .kokusai-panel-description h3{
  margin:0 0 6px !important;
  padding:0 !important;
  color:#333;
  font-size:18px;
  font-weight:700;
  line-height:1.5;
}

.kokusai-jigyo .kokusai-panel-description p{
  margin:0 !important;
  padding:0 !important;
  color:#444;
  font-size:14px;
  line-height:1.8;
}

/* =========================================================
   通常の国別写真
========================================================= */
.kokusai-jigyo .kokusai-panel-figure{
  position:relative;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  width:100%;
  height:330px;
  margin:0 !important;
  padding:0 !important;
  box-sizing:border-box;
}

.kokusai-jigyo .kokusai-panel-figure img{
  display:block;
  width:auto !important;
  max-width:100% !important;
  height:auto !important;
  max-height:300px !important;
  margin:0 auto !important;
  padding:0 !important;
  object-fit:contain;
}

.kokusai-jigyo .kokusai-panel-figure figcaption{
  display:block;
  width:100%;
  margin:8px 0 0 !important;
  padding:0 !important;
  color:#555;
  font-size:13px;
  line-height:1.5;
  text-align:center;
}

/* =========================================================
   セントルシア：3枚ギャラリー
========================================================= */
.kokusai-jigyo .kokusai-saintlucia-gallery{
  display:grid !important;
  grid-template-columns:1.08fr 1fr !important;
  grid-template-rows:184px 184px !important;
  width:94% !important;
  max-width:800px !important;
  height:380px !important;
  margin:18px auto 0 3% !important;
  padding:0 !important;
  gap:12px !important;
  box-sizing:border-box !important;
}

.kokusai-jigyo .kokusai-saintlucia-gallery figure{
  position:relative !important;
  display:block !important;
  width:100% !important;
  height:100% !important;
  min-height:0 !important;
  margin:0 !important;
  padding:0 !important;
  overflow:hidden !important;
  box-sizing:border-box !important;
}

/* 左：ショゼール漁港 */
.kokusai-jigyo .kokusai-saintlucia-gallery .kokusai-saintlucia-main{
  grid-column:1 !important;
  grid-row:1 / 3 !important;
  height:380px !important;
}

/* 右上：流況調査 */
.kokusai-jigyo .kokusai-saintlucia-gallery .kokusai-saintlucia-sub:nth-of-type(2){
  grid-column:2 !important;
  grid-row:1 !important;
  height:184px !important;
}

/* 右下：水理模型実験 */
.kokusai-jigyo .kokusai-saintlucia-gallery .kokusai-saintlucia-sub:nth-of-type(3){
  grid-column:2 !important;
  grid-row:2 !important;
  height:184px !important;
}

.kokusai-jigyo .kokusai-saintlucia-gallery figure img{
  display:block !important;
  width:100% !important;
  max-width:none !important;
  height:100% !important;
  max-height:none !important;
  margin:0 !important;
  padding:0 !important;
  object-fit:cover !important;
}

.kokusai-jigyo .kokusai-saintlucia-gallery figcaption{
  position:absolute !important;
  z-index:2;
  left:0 !important;
  bottom:0 !important;
  width:100% !important;
  margin:0 !important;
  padding:7px 10px !important;
  background:rgba(0,0,0,.55);
  color:#fff;
  font-size:13px;
  line-height:1.4;
  box-sizing:border-box;
}

/* =========================================================
   現在位置ドット
========================================================= */
.kokusai-jigyo .kokusai-dots{
  display:flex !important;
  align-items:center;
  justify-content:center;
  width:100%;
  margin:14px 0 30px !important;
  padding:0 !important;
  gap:8px;
  box-sizing:border-box;
}

.kokusai-jigyo .kokusai-dots > p{
  display:contents !important;
}

.kokusai-jigyo .kokusai-dot{
  display:block;
  flex:0 0 auto;
  width:6px;
  height:6px;
  margin:0;
  padding:0;
  background:#d7d7d7;
  border-radius:50%;
}

.kokusai-jigyo .kokusai-dot.is-active{
  background:#f28a32;
}

/* =========================================================
   業務を見る
========================================================= */
.kokusai-jigyo .dept-work-menu{
  margin-top:0;
}

/* =========================================================
   国際事業部：タブレット
========================================================= */
@media screen and (max-width:900px){

  /* 国別タブ：3列 */
  .kokusai-jigyo .kokusai-country-nav{
    grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  }

  .kokusai-jigyo .kokusai-country-tab{
    height:40px !important;
    padding:7px 4px !important;
    font-size:13px;
  }

  /* 地図マーカー */
  .kokusai-jigyo .kokusai-map-marker{
    min-width:76px;
    min-height:28px;
    padding:5px 8px;
    font-size:11px;
  }

  .kokusai-jigyo .kokusai-map-marker::before{
    height:14px;
  }

  .kokusai-jigyo .kokusai-map-marker::after{
    top:calc(100% + 14px);
    width:9px;
    height:9px;
  }
}

/* =========================================================
   国際事業部：スマホ
========================================================= */
@media screen and (max-width:700px){

  .kokusai-jigyo{
    scroll-margin-top:60px;
  }

  .kokusai-jigyo hgroup[is="xb-t"]{
    margin-bottom:28px !important;
  }

  .kokusai-jigyo .kokusai-work-catch{
    font-size:14px;
  }

  /* 世界地図 */
  .kokusai-jigyo .kokusai-map-area{
    margin-bottom:22px;
  }

  /* 地図マーカー */
  .kokusai-jigyo .kokusai-map-marker{
    min-width:0;
    min-height:22px;
    padding:4px 6px;
    border-radius:3px;
    font-size:9px;
  }

  .kokusai-jigyo .kokusai-map-marker::before{
    height:10px;
  }

  .kokusai-jigyo .kokusai-map-marker::after{
    top:calc(100% + 10px);
    width:8px;
    height:8px;
    border-width:2px;
  }

  /* -------------------------------------------------------
     国別タブ：2列
  ------------------------------------------------------- */
  .kokusai-jigyo .kokusai-country-nav{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    margin-bottom:14px !important;
    gap:0 !important;
  }

  .kokusai-jigyo .kokusai-country-tab{
    height:40px !important;
    padding:7px 4px !important;
    font-size:12px;
  }

  .kokusai-jigyo .kokusai-country-tab.is-active::before{
    width:5px;
    height:5px;
    margin-right:5px;
  }

  /* -------------------------------------------------------
     国別情報
  ------------------------------------------------------- */
  .kokusai-jigyo .kokusai-panel-area{
    height:390px;
  }

  .kokusai-jigyo .kokusai-panel{
    padding-top:16px !important;
  }

  .kokusai-jigyo .kokusai-panel-description{
    margin-bottom:12px !important;
  }

  .kokusai-jigyo .kokusai-panel-description h3{
    font-size:16px;
  }

  .kokusai-jigyo .kokusai-panel-description p{
    font-size:13px;
    line-height:1.7;
  }

  /* 通常写真 */
  .kokusai-jigyo .kokusai-panel-figure{
    height:260px;
  }

  .kokusai-jigyo .kokusai-panel-figure img{
    max-height:230px !important;
  }

  .kokusai-jigyo .kokusai-panel-figure figcaption{
    font-size:11px;
  }

  /* -------------------------------------------------------
     セントルシア：3枚ギャラリー
  ------------------------------------------------------- */
  .kokusai-jigyo .kokusai-saintlucia-gallery{
    grid-template-columns:1fr 1fr !important;
    grid-template-rows:150px 150px !important;
    width:100% !important;
    height:308px !important;
    margin:14px 0 0 !important;
    gap:8px !important;
  }

  .kokusai-jigyo .kokusai-saintlucia-gallery .kokusai-saintlucia-main{
    height:308px !important;
  }

  .kokusai-jigyo .kokusai-saintlucia-gallery .kokusai-saintlucia-sub:nth-of-type(2),
  .kokusai-jigyo .kokusai-saintlucia-gallery .kokusai-saintlucia-sub:nth-of-type(3){
    height:150px !important;
  }

  .kokusai-jigyo .kokusai-saintlucia-gallery figcaption{
    padding:5px 7px !important;
    font-size:11px;
  }

  /* 現在位置ドット */
  .kokusai-jigyo .kokusai-dots{
    margin:12px 0 24px !important;
    gap:7px;
  }
}

/* =========================================================
   国際事業部：業務を見る（初期8件＋展開14件）
========================================================= */
.kokusai-jigyo .kokusai-link-menu{
  display:block !important;
  width:100% !important;
  margin-top:40px !important;
}
.kokusai-jigyo .kokusai-link-menu .dept-work-menu-title{
  display:block;
}

/* 国際事業部：業務リンクを左右2列に配置 */
.kokusai-jigyo .kokusai-link-menu .kokusai-all-links{
  display:grid !important;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr) !important;
  column-gap:32px !important;
  row-gap:0 !important;
  width:100% !important;
  margin:20px 0 0 !important;
  padding:0 !important;
  box-sizing:border-box;
}
.kokusai-jigyo .kokusai-link-menu .kokusai-all-links > .dept-fixed-col{
  display:flex !important;
  flex-direction:column !important;
  align-items:stretch !important;
  justify-content:flex-start !important;
  gap:24px !important;
  flex:none !important;
  width:100% !important;
  min-width:0 !important;
  margin:0 !important;
  padding:0 !important;
  box-sizing:border-box;
}

/* 通常リンク・追加リンク共通 */
.kokusai-jigyo .kokusai-link-menu .dept-fixed-col > a,
.kokusai-jigyo .kokusai-link-menu .kokusai-extra > a{
  display:block !important;
  position:static !important;
  flex:none !important;
  box-sizing:border-box;
  width:100% !important;
  height:auto !important;
  min-height:0 !important;
  margin:0 !important;
  padding:0 !important;
  color:#444 !important;
  font-size:16px !important;
  font-weight:400 !important;
  line-height:1.6 !important;
  text-decoration:none !important;
  word-break:normal;
  overflow-wrap:anywhere;
  transform:none !important;
}
/* 三角マーク */
.kokusai-jigyo .kokusai-link-menu .dept-fixed-col > a::before,
.kokusai-jigyo .kokusai-link-menu .kokusai-extra > a::before{
  content:"";
  display:inline-block;
  width:10px;
  height:10px;
  margin-right:10px;
  background:#c0d2f0;
  clip-path:polygon(0 0,100% 50%,0 100%);
}
/* 追加14件：初期状態では非表示 */
.kokusai-jigyo .kokusai-link-menu .kokusai-extra{
  display:none !important;
  flex-direction:column !important;
  gap:24px !important;
  width:100% !important;
  margin:0 !important;
  padding:0 !important;
}

/* 国際事業部：通常リンクと追加リンクの境目の余白調整 */
.kokusai-jigyo .kokusai-link-menu .dept-fixed-col > .kokusai-extra{
  margin-top:-24px !important;
}

/* 展開時のみ表示 */
.kokusai-jigyo .kokusai-link-menu.is-expanded .kokusai-extra{
  display:flex !important;
}
/* もっと見る・閉じる */
.kokusai-jigyo .kokusai-more-controls{
  display:flex;
  justify-content:center;
  margin-top:32px;
}
.kokusai-jigyo .kokusai-more-btn{
  box-sizing:border-box;
  display:block;
  width:fit-content;
  min-width:260px;
  max-width:100%;
  margin:0 auto;
  padding:12px 28px;
  border:1px solid #bbb;
  border-radius:9999px;
  background:#fff;
  color:#555;
  font-size:14px;
  font-weight:500;
  line-height:1.6;
  text-align:center;
  cursor:pointer;
  transition:background .2s,border-color .2s;
}
.kokusai-jigyo .kokusai-more-btn:hover{
  background:#f5f7fa;
  border-color:#999;
}
/* hidden属性を優先 */
.kokusai-jigyo .kokusai-more-btn[hidden]{
  display:none !important;
}
/* リーフレット */
.kokusai-jigyo .kokusai-link-menu .dept-leaflet-menu{
  margin-top:30px;
}
/* スマートフォン */
@media(max-width:767px){
  .kokusai-jigyo .kokusai-link-menu .kokusai-all-links{
    grid-template-columns:1fr !important;
    gap:24px !important;
  }
  
  .kokusai-jigyo .kokusai-link-menu .dept-fixed-col{
    flex:none !important;
    width:100% !important;
    gap:18px !important;
  }
  .kokusai-jigyo .kokusai-link-menu .kokusai-extra{
    gap:18px !important;
  }
  .kokusai-jigyo .kokusai-link-menu .dept-fixed-col > a,
  .kokusai-jigyo .kokusai-link-menu .kokusai-extra > a{
    font-size:15px !important;
  }
  .kokusai-jigyo .kokusai-more-btn{
    min-width:0;
    padding:10px 22px;
    font-size:13px;
  }
}


/* =========================================================
   国際事業部：WordPress自動挿入タグ対策＋2列表示
========================================================= */
.kokusai-jigyo .kokusai-work .kokusai-link-menu{
  display:block !important;
  width:100% !important;
  margin:40px 0 0 !important;
  padding:0 !important;
}
.kokusai-jigyo .kokusai-link-menu .kokusai-all-links{
  display:grid !important;
  grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  align-items:start !important;
  column-gap:32px !important;
  row-gap:0 !important;
  width:100% !important;
  margin:20px 0 0 !important;
  padding:0 !important;
}
/* WordPressが挿入するpタグをGridの要素から除外 */
.kokusai-jigyo .kokusai-link-menu .kokusai-all-links > p{
  display:none !important;
}
/* 左右のリンク列 */
.kokusai-jigyo .kokusai-link-menu .kokusai-all-links > .dept-fixed-col{
  display:flex !important;
  flex-direction:column !important;
  align-items:stretch !important;
  gap:24px !important;
  flex:none !important;
  width:100% !important;
  min-width:0 !important;
  margin:0 !important;
  padding:0 !important;
}
/* リンク間のbrタグを非表示 */
.kokusai-jigyo .kokusai-link-menu .dept-fixed-col > br,
.kokusai-jigyo .kokusai-link-menu .kokusai-extra > br{
  display:none !important;
}
/* リンクの表示 */
.kokusai-jigyo .kokusai-link-menu .dept-fixed-col > a,
.kokusai-jigyo .kokusai-link-menu .kokusai-extra > a{
  display:block !important;
  width:100% !important;
  margin:0 !important;
  padding:0 !important;
  text-align:left !important;
  white-space:normal !important;
  writing-mode:horizontal-tb !important;
}
/* スマートフォン */
@media(max-width:767px){
  .kokusai-jigyo .kokusai-link-menu .kokusai-all-links{
    grid-template-columns:1fr !important;
    gap:24px !important;
  }
}