@charset "UTF-8";
/* リセット、フォント、変数(:root) */

/* =====================================
01. Root Tokens (変数)
===================================== */
:root {
	/* ===Color === */
--color-white:#FFFFFF;
--color-primary:#055393;
--color-text-primary:#055393;
--color-bg-primary:linear-gradient(
		90deg,
		#066cbf 0%,
		#055395 100%
	);;
	--color-bg-corporate:linear-gradient(
		90deg,
		#055393 0%,
		#00A73D 100%
	);;


	/* === Spacing === */
	/* 固定幅 */
--space-8: 8px;
--space-16: 16px;
--space-24: 24px;
--space-32: 32px;
--space-40: 40px;
--space-48: 48px;
--space-56: 56px;
--space-64: 64px;
--space-72: 72px;
--space-80: 80px;
--space-88: 88px;
--space-96: 96px;
--space-104: 104px;
--space-112: 112px;
--space-120: 120px;
--space-128: 128px;
--space-136: 136px;
--space-144: 144px;
--space-152: 152px;
--space-160: 160px;

/* vw幅対応 */
	--space-fluid-8: clamp(8px, 1vw, 16px);
	--space-fluid-16: clamp(16px, 2vw, 32px);
	--space-fluid-24: clamp(24px, 3vw, 48px);
	--space-fluid-32: clamp(32px, 4vw, 64px);
	--space-fluid-40: clamp(40px, 5vw, 80px);
	--space-fluid-48: clamp(48px, 6vw, 96px);
	--space-fluid-56: clamp(56px, 7vw, 112px);
	--space-fluid-64: clamp(64px, 8vw, 128px);
	--space-fluid-72: clamp(72px, 9vw, 144px);
	--space-fluid-80: clamp(80px, 10vw, 160px);
	--space-fluid-88: clamp(88px, 11vw, 176px);
	--space-fluid-96: clamp(96px, 12vw, 192px);
	--space-fluid-104: clamp(104px, 13vw, 208px);
	--space-fluid-112: clamp(112px, 14vw, 224px);
	--space-fluid-120: clamp(120px, 15vw, 240px);
	--space-fluid-128: clamp(128px, 16vw, 256px);
	--space-fluid-136: clamp(136px, 17vw, 272px);
	--space-fluid-144: clamp(144px, 18vw, 288px);
	--space-fluid-152: clamp(152px, 19vw, 304px);
	--space-fluid-160: clamp(160px, 20vw, 320px);


/* Line-height */
--lh-heading: var(--lh-12); /* 見出し */
--lh-body: var(--lh-17); /* 本文 */
--lh-caption: var(--lh-20); /* 長文 */

/* Letter-spacing */
--ls-heading: var(--ls-n1);
--ls-body: var(--ls-0);
--ls-catch: var(--ls-5);
--ls-accent: var(--ls-10);

--lh-12: 1.2;
--lh-17: 1.7;
--lh-20: 2;

--ls-n1: -0.01em;
--ls-0: 0;
--ls-5: 0.05em;
--ls-10: 0.1em;


	/* Fixed sizes（PC想定） */
/* 固定フォントサイズ */
--fz-12: 1.2rem;  /* 12px */
--fz-14: 1.4rem;  /* 14px */
--fz-16: 1.6rem;  /* 16px */
--fz-18: 1.8rem;  /* 18px */
--fz-20: 2rem;    /* 20px */
--fz-24: 2.4rem;  /* 24px */
--fz-28: 2.8rem;  /* 28px */
--fz-32: 3.2rem;  /* 32px */
--fz-36: 3.6rem;  /* 36px */
--fz-40: 4rem;    /* 40px */
--fz-48: 4.8rem;  /* 48px */
--fz-56: 5.6rem;
--fz-64: 6.4rem;  /* 64px */
--fz-80: 8rem;    /* 80px */

	/* vwフォントサイズ */
--fz-fluid-12: clamp(1.2rem, 1vw, 1.6rem);
--fz-fluid-14: clamp(1.4rem, 1.2vw, 1.8rem);
--fz-fluid-16: clamp(1.6rem, 1.5vw, 2rem);
--fz-fluid-18: clamp(1.8rem, 1.8vw, 2.4rem);
--fz-fluid-20: clamp(2rem, 2vw, 2.8rem);
--fz-fluid-24: clamp(2.4rem, 2.5vw, 3.2rem);
--fz-fluid-28: clamp(2.8rem, 3vw, 3.6rem);
--fz-fluid-32: clamp(3.2rem, 3.5vw, 4rem);
--fz-fluid-36: clamp(3.6rem, 4vw, 4.8rem);
--fz-fluid-40: clamp(4rem, 5vw, 5.6rem);
--fz-fluid-48: clamp(4.8rem, 6vw, 6.4rem);
--fz-fluid-64: clamp(6.4rem, 8vw, 8rem);
--fz-fluid-80: clamp(8rem, 10vw, 10rem);


	/* === Fontfamily === */
/* ベース */
	--font-ja: 'Noto Sans JP', 'Yu Gothic', 'YuGothic', sans-serif;
	--font-en: 'Work Sans', sans-serif;

	--font-body: var(--font-ja);
	--font-heading: var(--font-en);

}




/* =====================================
02. Reset 基本リセット
- 余白/装飾の初期化・ボックスモデル
===================================== */
*,
*::before,
*::after {
	box-sizing: border-box;
}

body,
h1,
h2,
h3,
h4,
p,
figure,
blockquote,
dl,
dd,
ul,
ol,
li {
	margin: 0;
	padding: 0;
	font-weight: inherit;
}

ul,
ol {
	list-style: none;
}

table {
	border-collapse: collapse;
	border-spacing: 0;
}

/* =====================================
03. Base HTML 設定
- フォントサイズ・スクロール挙動
===================================== */
html {
	font-size: 62.5%;
}

html:focus-within {
	scroll-behavior: smooth;
}

/* =====================================
04. Typography & Body ベース
===================================== */
body {
	position: relative;
	min-height: 100vh;
	text-rendering: optimizeSpeed;
	line-height: var(--lh-normal);
	font-size: var(--fz-16);
	font-weight: 400;
	width: 100%;
	height: 100%;
	color: var(--color-primary);
	overflow-x: hidden;
	font-family: var(--font-ja);
	/* フォントスムージング（Mac最適化） */
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	z-index: -1;
	background-color: var(--color-white);
}

/* =====================================
05. Links リンク
===================================== */
a {
	color: inherit;
	text-decoration: none;
}
a:not([class]) {
	text-decoration-skip-ink: none;
}

/* =====================================
06. Inline Elements 強調表現の継承
===================================== */
em,
strong,
b,
i {
	font-weight: inherit;
	font-size: inherit;
	font-style: inherit;
}

/* =====================================
07. Media メディア要素のリセット/整形
===================================== */
img,
picture {
	max-width: 100%;
	height: auto;
	vertical-align: bottom;
}

img,
svg,
video {
	display: block;
	height: auto;
}

/* 画像のドラッグ防止 */
img {
	user-select: none;
	-webkit-user-drag: none;
}

/* picture 要素のブロック化 */
picture {
	display: block;
}

address {
	font-style: normal;
}

.video_wrapper video {
	width: 100%;
	height: auto;
	object-fit: cover;
	display: block;
}

/* =====================================
08. Form フォーム/ボタン初期化
===================================== */
input,
button,
textarea,
select {
	font: inherit;
	border: none;
}

/* ボタンのアクセシビリティ */
button {
	cursor: pointer;
	background: none;
}
button:disabled {
	cursor: default;
}

/* iOS系の見た目リセット */
input,
textarea {
	appearance: none;
	border-radius: 0;
}

/* =====================================
09. Motion Preferences 動きの最小化
===================================== */
@media (prefers-reduced-motion: reduce) {
	html:focus-within {
		scroll-behavior: auto;
	}
	*,
	*::before,
	*::after {
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
		scroll-behavior: auto !important;
	}
}
