/*
 * IR セクション専用スタイル。
 * このファイルは /ir 以下のページからのみ読み込む。既存ページの表示には影響しない。
 *
 * - .chd*  : コーポレートサイトのヘッダーを手書きで複製したもの（採寸値はREADME-ir.md）
 * - .cft*  : 同じくフッターの複製
 * - .irdoc : IRデザインのプロトタイプ由来コンテンツ（インラインstyleを保持）
 * - .scp0〜.scp5 : プロトタイプのホバー指定を再現したクラス
 */

/* ---------- base ---------- */

*,
*::before,
*::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; }

body {
  margin: 0;
  background: #ffffff;
  color: #3a3a38;
  font-family: "Noto Sans JP", "Inter", sans-serif;
}

img { max-width: 100%; }

/* ---------- サンプルデータ告知（本番公開しない前提の確認用表示） ---------- */

.ir-notice {
  background: #161616;
  color: #ffffff;
  font-size: 12px;
  line-height: 1.7;
  padding: 10px 32px;
}

.ir-notice-inner {
  max-width: 1120px;
  margin: 0 auto;
}

.ir-notice b {
  color: #0cf8c0;
  font-weight: 700;
}

/* ---------- corporate header (replica) ---------- */

.chd {
  position: sticky;
  top: 0;
  z-index: 50;
  display: flex;
  align-items: center;
  height: 64px;
  padding: 0 32px;
  background: rgba(255, 255, 255, 0.5);
  backdrop-filter: blur(5px);
  -webkit-backdrop-filter: blur(5px);
}

.chd-inner {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 0;
  position: relative;
  width: 100%;
  max-width: 1120px;
  margin: 0 auto;
}

.chd-logo { display: block; flex: 0 0 auto; }
.chd-logo img { display: block; width: 120px; height: 27px; }

.chd-nav {
  display: flex;
  align-items: center;
  gap: 19px;
  margin-left: auto;
  padding-left: 8px;
}

.chd-link {
  display: inline-flex;
  align-items: center;
  color: #192639;
  font-family: sans-serif;
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 0.14px;
  line-height: 19.6px;
  text-decoration: none;
  white-space: nowrap;
}

.chd-toggle {
  margin: 0;
  padding: 0;
  border: 0;
  background: none;
  cursor: pointer;
}

.chd-caret { width: 16px; height: 16px; margin-left: -1px; }

.chd-group {
  position: relative;
  display: flex;
  align-items: center;
}

.chd-panel {
  position: absolute;
  top: calc(100% + 10px);
  left: 50%;
  transform: translateX(-50%);
  display: none;
  min-width: 220px;
  max-width: 320px;
  padding: 8px 0;
  background: #ffffff;
  border: 1px solid #e4e7eb;
  box-shadow: 0 12px 32px rgba(25, 38, 57, 0.12);
}

.chd-group:hover .chd-panel,
.chd-group:focus-within .chd-panel { display: block; }

.chd-panel-inner { display: flex; flex-direction: column; }

.chd-panel a {
  padding: 9px 18px;
  color: #192639;
  font-family: sans-serif;
  font-size: 13px;
  font-weight: 500;
  line-height: 1.6;
  text-decoration: none;
}

.chd-actions { display: flex; align-items: center; gap: 8px; margin-left: 16px; }

.chd-language {
  display: flex;
  align-items: center;
  gap: 8px;
  color: #192639;
  font-family: sans-serif;
  font-size: 14px;
  font-weight: 700;
  line-height: 1;
}

.chd-language a,
.chd-language span { color: inherit; text-decoration: none; }
.chd-language a { opacity: 0.55; }

.chd-pill {
  display: inline-flex;
  align-items: center;
  padding: 4px 14px;
  border-radius: 18px;
  font-family: sans-serif;
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 0.14px;
  line-height: 19.6px;
  text-decoration: none;
  white-space: nowrap;
}

.chd-pill-fill { background: #0cf8c0; color: #192639; }
.chd-pill-line { border: 1px solid #192639; color: #192639; }

.chd-burger {
  display: none;
  flex-direction: column;
  justify-content: center;
  gap: 5px;
  width: 27px;
  height: 27px;
  margin: 0;
  padding: 0;
  border: 0;
  background: none;
  cursor: pointer;
}

.chd-burger span {
  display: block;
  width: 100%;
  height: 2px;
  background: #1bd5ad;
}

/* ---------- mobile drawer ---------- */

.chd-drawer {
  position: fixed;
  inset: 0;
  z-index: 60;
  overflow-y: auto;
  padding: 0 16px 40px;
  background: #ffffff;
}

.chd-drawer[hidden] { display: none; }

.chd-drawer-head {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  height: 64px;
}

.chd-close {
  width: 32px;
  height: 32px;
  margin: 0;
  padding: 0;
  border: 0;
  background: none;
  color: #1bd5ad;
  cursor: pointer;
}

.chd-close svg { width: 100%; height: 100%; }

.chd-drawer-nav { display: flex; flex-direction: column; padding: 0 16px; }

.chd-d1,
.chd-d2 {
  display: block;
  padding: 12px 0;
  border-bottom: 1px solid #e6e8ec;
  color: #192639;
  text-decoration: none;
}

.chd-d1 {
  font-family: sans-serif;
  font-size: 22px;
  font-weight: 700;
  letter-spacing: 0.02em;
}

.chd-d2 {
  padding-left: 16px;
  font-family: sans-serif;
  font-size: 15px;
  font-weight: 700;
}

body.ir-drawer-open { overflow: hidden; }

/* ---------- corporate footer (replica) ---------- */

.cft {
  display: flex;
  flex-direction: column;
  gap: 80px;
  padding: 80px 32px;
  background: #192639;
}

.cft-inner {
  display: flex;
  align-items: flex-start;
  gap: 32px;
  width: 100%;
  max-width: 1120px;
  margin: 0 auto;
}

.cft-left,
.cft-right { flex: 1 1 0; min-width: 0; }

.cft-left { display: flex; flex-direction: column; align-items: flex-start; gap: 24px; }
.cft-logo img { display: block; width: 140px; height: auto; }

.cft-name,
.cft-addr {
  margin: 0;
  color: #989ea9;
  font-family: "Inter", "Noto Sans JP", sans-serif;
  font-size: 12px;
  line-height: 1.4;
}

.cft-name { font-weight: 600; }
.cft-addr { font-weight: 400; }

.cft-social { display: flex; align-items: center; gap: 32px; }
.cft-group { display: flex; flex-wrap: wrap; align-items: center; gap: 16px 32px; }
.cft-social img,
.cft-group img { display: block; }
.cft-menu-title {
  margin: 0;
  padding: 8px 0;
  color: #ffffff;
  font-family: sans-serif;
  font-size: 16px;
  font-weight: 600;
  line-height: 1.4;
}

.cft-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  width: 100%;
  margin: 0;
  padding: 9px 0;
  border-top: 0;
  border-right: 0;
  border-bottom: 1px solid #ffffff;
  border-left: 0;
  background: none;
  color: #ffffff;
  font-family: sans-serif;
  font-size: 16px;
  font-weight: 600;
  line-height: 1.4;
  text-align: left;
  text-decoration: none;
}

.cft-row-sub {
  margin-left: 16px;
  width: calc(100% - 16px);
  padding: 10px 0;
  font-size: 14px;
  font-weight: 700;
}

.cft-row-head { border-bottom-color: transparent; }
.cft-row-toggle { cursor: pointer; }
.cft-submenu[hidden] { display: none; }

.cft-chevron { flex: 0 0 auto; width: 20px; height: 20px; }
a.cft-row .cft-chevron { color: #0cf8c0; }
.cft-row-toggle .cft-chevron { color: rgba(255, 255, 255, 0.18); }

.cft-copy {
  margin: 0;
  color: rgba(255, 255, 255, 0.5);
  font-family: "Inter", "Noto Sans JP", sans-serif;
  font-size: 14px;
  line-height: 1.4;
  text-align: center;
}

/* ---------- IR content ---------- */

.irdoc { background: #ffffff; }

.irdoc a { color: #0da07e; text-decoration: none; }
.irdoc a:hover { color: #087a5f; }

/*
 * PC ブロックはプロトタイプの 1440px キャンバスで作られている。
 * ここではコーポレートサイトのコンテンツ幅（1120px）に合わせて中央寄せする。
 * 幅を変えたい場合は --ir-page-width の値だけを変更すればよい。
 */
.irdoc-pc {
  --ir-page-width: 1216px;
  max-width: var(--ir-page-width);
  margin: 0 auto;
}

.irdoc-sp { display: none; }

/*
 * ヘッダー・フッターは既存サイトと同じ 768px で切り替える。
 * IRコンテンツはプロトタイプのPC版が 1440px キャンバスで作られていて
 * 885px 程度ないと収まらないため、1024px で切り替える。
 */
@media (max-width: 1024px) {
  .irdoc-pc { display: none; }
  .irdoc-sp { display: block; }
}

@media (max-width: 768px) {
  .chd { padding: 0 16px; }
  .chd-nav,
  .chd-actions { display: none; }
  .chd-burger { display: flex; margin-left: auto; }

  .cft { gap: 48px; padding: 56px 16px; }
  .cft-inner { flex-direction: column; }
  .cft-left,
  .cft-right { width: 100%; }
  .ir-notice { padding: 8px 16px; font-size: 11px; line-height: 1.6; }
}

@media (min-width: 769px) {
  .chd-drawer { display: none !important; }
}

/* 年度タブで切り替える資料一覧（IRライブラリー配下） */
.ir-year[hidden] { display: none; }

/* ---------- プロトタイプのホバー指定の再現 ---------- */

.scp0:hover { color: #161616 !important; }
.scp1:hover { background: #f6f5f2 !important; }
.scp2:hover { background: #161616 !important; color: #ffffff !important; }
.scp3:hover { color: #0da07e !important; }
.scp4:hover { border-color: #161616 !important; color: #161616 !important; }
.scp5:hover { background: #f6f5f2 !important; border-color: #161616 !important; }