@charset "UTF-8";
/* ==========================================================================
   base.css ── 変数・リセット・文字の基本・コンテナ
   値は Figma（確定版 HGgllOitkCYvCFoauDQA70・2026-09-30 取得）のもの
   変数の一覧（追加する前に、同じ名前が無いかを確認する）
     色      --pw-color-*
     文字    --pw-font-ja / --pw-font-en
     寸法    --pw-unit（PCのデザイン幅1440に対する1px） / --pw-unit-sp（SPのデザイン幅375に対する1px）
             --pw-gutter（左右の余白） / --pw-content（中身の最大幅）
     動き    --pw-ease-io / --pw-time-hover
   ========================================================================== */
:root {
	--pw-color-primary: #006F38;
	--pw-color-primary-dark: #004121;
	--pw-color-secondary: #168A51;
	--pw-color-accent: #E57C5D;
	--pw-color-accent-dark: #C05434;
	--pw-color-line: #06C755;
	--pw-color-line-dark: #039F43;
	--pw-color-marker: #F6FF50;
	--pw-color-text: #52543D;
	--pw-color-caption: #7E7E7E;
	--pw-color-placeholder: #999999;
	--pw-color-logo: #1D6C07;
	--pw-color-bg: #FEFFF6;
	--pw-color-bg-yellowgreen: #EFF7DF;
	--pw-color-bg-green10: #E9F3E9;
	--pw-color-bg-green30: #E0EADF;
	--pw-color-bg-green50: #D8E4D7;
	--pw-color-border: #D7DBCF;
	--pw-color-border-green: #159656;
	--pw-color-white: #FFFFFF;
	--pw-color-red: #FF0000;

	--pw-font-ja: "Zen Kaku Gothic New", "Hiragino Kaku Gothic ProN", "Hiragino Sans", "Yu Gothic", Meiryo, sans-serif;
	--pw-font-en: "Montserrat", "Zen Kaku Gothic New", sans-serif;

	--pw-unit: calc(min(100vw, 1440px) / 1440);
	--pw-unit-sp: calc(min(100vw, 500px) / 375);
	--pw-gutter: max(24px, calc(120 * var(--pw-unit)));
	--pw-content: 1200px;

	--pw-ease-io: ease-in-out;
	--pw-time-hover: .3s;
}

/* ---- リセット（詳細度0。個別の指定を打ち消さない） ---- */
:where(*, *::before, *::after) { box-sizing: border-box; }
:where(html) { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
:where(body, h1, h2, h3, h4, h5, h6, p, figure, blockquote, dl, dd, ul, ol) { margin: 0; }
:where(ul, ol) { padding: 0; list-style: none; }
:where(img, svg, video, iframe) { display: block; max-width: 100%; }
:where(img) { height: auto; }
:where(a) { color: inherit; text-decoration: none; }
:where(button) { font: inherit; color: inherit; background: none; border: 0; padding: 0; cursor: pointer; }
:where(table) { border-collapse: collapse; border-spacing: 0; }
:where(th, td) { padding: 0; font-weight: inherit; text-align: inherit; }
:where(address, em) { font-style: normal; }

html { scroll-behavior: smooth; }
body.pw-body {
	background: var(--pw-color-bg);
	color: var(--pw-color-text);
	font-family: var(--pw-font-ja);
	font-size: 16px;
	font-weight: 500;
	line-height: 1.8;
	font-feature-settings: normal;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	overflow-wrap: anywhere;
	line-break: strict;                 /* 「ー」「。」などを行頭に置かない（Figma の折り返しと同じ規則） */
}
.pw-main { display: flow-root; }

/* ---- コンテナ ---- */
.pw-container {
	width: min(var(--pw-content), 100% - var(--pw-gutter) * 2);
	margin-inline: auto;
}

/* ---- キーボード操作 ---- */
.pw-skip {
	position: absolute; left: 8px; top: -60px; z-index: 1000;
	padding: 8px 16px; background: var(--pw-color-primary); color: var(--pw-color-white);
}
.pw-skip:focus { top: 8px; }
:where(a, button, input, textarea, select, summary):focus-visible {
	outline: 2px solid var(--pw-color-primary);
	outline-offset: 2px;
}

/* ---- 画面の出し分け ---- */
.pw-only-sp { display: none; }
@media (min-width: 768px) and (max-width: 1024px) {
	:root { --pw-gutter: 40px; }        /* タブレット：左右の余白を縮めて中身を収める（デザインなし・実装の判断） */
}
@media (max-width: 767px) {
	:root { --pw-gutter: 20px; }
	.pw-only-pc { display: none; }
	.pw-only-sp { display: revert; }
}

/* ---- 動きを減らす設定のとき ---- */
@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto; }
	*, *::before, *::after {
		animation-duration: .01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: .01ms !important;
	}
}

/* ---- 仮のページ（ブログなど、専用のテンプレートを作るまで） ---- */
.pw-plain { padding: 160px 0 80px; }
.pw-plain__body { margin-top: 24px; }
