@charset "UTF-8";
/* =====================================================================
   コーポレートサイト 共通スタイルの土台(/common/css/site.css)
   既存サイト(https://www.isgroup.co.jp/。Bootstrap 3 + common.css 等)の見た目を、
   Bootstrap 5.3 を土台に再現する。
   ・ファイルの分け方(layout :: headAssets でこの順に読み込む。グローバル人材採用はこの後に recruit-global.css):
       site.css            … 変数(配色・フォント)・要素の既定(見出し・段落・リスト)・本文の幅・共通の小物
       site-layout.css     … 画面の骨組み(左部メニュー・上部バー・言語切替・パンくず・メインビジュアル・フッター等)
       site-components.css … 複数の画面で使う部品(見出し・ボタン・会社情報・カード・フォームの同意チェック等)
       page/*.css          … 画面ごとのスタイル(top・corporate・group・news・recruit・sitemap・inquiry)。
                             その画面だけで読み込む(SitePage の style。画面固有の CSS が無い画面は読み込まない)
   ・レイアウト: 左部メニュー(15vw / 最小150px)+ 右カラム(メインビジュアル・本文・フッター)
   ・md(768px)未満: 左部メニューは Bootstrap の offcanvas(左からのドロワー)
   ・文字サイズは Bootstrap 標準(html 16px = 1rem)。本文は .875rem(14px。既存サイトと同じ)。
     ボタン・フォーム・アラート・余白等は Bootstrap の部品・ユーティリティをそのまま使い、このファイルでは寸法を指定し直さない。
     レイアウト(横並び・列)も、できるだけ Bootstrap の row / col・d-flex・gap 等をテンプレートで使う。
     (既存サイトの文字サイズ切替(html の font-size 62.5% = 1rem 10px)は、ユーザー判断で削除した)
   ・配色: ネイビー #031f54 / リンクホバー #2357b8 / 本文 #666
   ===================================================================== */

:root {
	--site-navy: #031f54;
	--site-navy-rgb: 3, 31, 84;
	--site-blue: #2357b8;
	--site-blue-muted: #295a8d;
	--site-orange: #fb7900;
	--site-nav-sub: #95a4c9;
	--site-text: #666;
	--site-text-dark: #333;
	--site-link-gray: #595959;
	--site-border: #ccc;
	--site-border-light: #ddd;
	--site-bg-light: #f7f7f7;
	--site-required: #c00;
	/* 日本語のフォント(本文の既定。ページタイトル(.heading-page)は英語の画面でもこれを使う) */
	--site-font-ja: -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Segoe UI", "Yu Gothic", 游ゴシック, YuGothic,
		游ゴシック体, "Noto Sans Japanese", "ヒラギノ角ゴ ProN W3", Meiryo, sans-serif;
	/* 本文のフォント(英語・中国語は html:lang で差し替える) */
	--site-font: var(--site-font-ja);
	--site-font-en: futura-pt, Futura, "Century Gothic", "Avenir Next", "Trebuchet MS", sans-serif;

	--bs-body-font-family: var(--site-font);
	--bs-body-font-size: .875rem;
	--bs-body-line-height: 1.42857;
	--bs-body-color: var(--site-text);
	--bs-link-color: var(--site-navy);
	--bs-link-color-rgb: var(--site-navy-rgb);
	--bs-link-hover-color: var(--site-blue);
	--bs-link-hover-color-rgb: 35, 87, 184;
	--bs-border-color: var(--site-border-light);
}

html {
	scroll-behavior: smooth;
}

/* 英語は既存サイトの英語版と同じ欧文フォント */
html:lang(en) {
	--site-font: Verdana, Arial, sans-serif;
}

/* 中国語は中国語(簡体字)のフォントを先に指定する
   (日本語フォントに無い簡体字だけ別のフォントになり、太さがそろわないため。ユーザー判断) */
html:lang(zh) {
	--site-font: -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Segoe UI", "PingFang SC", "Hiragino Sans GB",
		"Microsoft YaHei", "Noto Sans SC", "Noto Sans CJK SC", "Source Han Sans SC", sans-serif;
}

img {
	max-width: 100%;
	height: auto;
}

/* リンクの色は --bs-link-color(:root)。既存サイトと同じくホバー時に下線を消す */
a:hover,
a:focus {
	text-decoration: none;
}

@media (min-width: 768px) {
	a img:hover {
		opacity: .5;
	}
}

:focus-visible {
	outline: 3px solid var(--site-orange);
	outline-offset: 2px;
}

/* 見出し・段落の寸法(既存サイト(Bootstrap 3)と同じ px) */
h1, h2, h3, h4, h5, h6 {
	font-weight: 500;
	line-height: 1.1;
	color: inherit;
}

h1, h2, h3 {
	margin: 1.25rem 0 .625rem;
}

h4, h5, h6 {
	margin: .625rem 0;
}

h1 { font-size: 2.25rem; }
h2 { font-size: 1.875rem; }
h3 { font-size: 1.5rem; }
h4 { font-size: 1.125rem; }
h5 { font-size: .875rem; }
h6 { font-size: .75rem; }

p {
	margin: 0 0 .625rem;
}

ol,
ul {
	margin-bottom: .625rem;
	padding-left: 2em;
}

dl {
	margin-bottom: 1.25rem;
}

dd {
	margin: 0;
}

/* 既存サイトの .container と同じ幅(md未満 90vw / md以上 85%・最大1000px) */
.container-site {
	width: 90vw;
	max-width: 1000px;
	margin-inline: auto;
	padding: 0;
}

@media (min-width: 768px) {
	.container-site {
		width: 85%;
	}
}

.main-inner {
	margin: 0 auto 10vw;
}

@media (min-width: 768px) {
	.main-inner {
		margin-bottom: 4vw;
	}
}


.text-prewrap {
	white-space: pre-wrap;
}

@media (prefers-reduced-motion: reduce) {
	html {
		scroll-behavior: auto;
	}

	*,
	*::before,
	*::after {
		transition: none !important;
	}
}