@charset "utf-8";
/*
* page-vision.php 専用スタイル
* デザイン承認版（design-draft-v4.html）を忠実に移植。
* 静けさ・誠実さ・編集的（エディトリアル）レイアウト。
* 英語ラベル・カード・バッジ・円グラフは使用しない。
* すべて #jicci-vision 配下にスコープし、テーマ本体のCSSに影響を与えない。
*/
#jicci-vision{
--v-font-color:#3a3835;
--v-main-color:#6cc2b2;
--v-sub-color:#e36032;
--v-bg-color:#fbf8f4;
--v-rule:rgba(58,56,53,.16);
background-color:var(--v-bg-color);
color:var(--v-font-color);
font-family:"Noto Sans JP","Hiragino Kaku Gothic ProN",sans-serif;
line-height:1.9;
letter-spacing:.04em;
text-align:justify;
font-feature-settings:"palt";
}
#jicci-vision .vision-serif{font-family:"游明朝","Yu Mincho",HGS明朝E,serif;}
#jicci-vision .vision-wrap{max-width:720px;margin-inline:auto;padding-inline:28px;}
#jicci-vision .vision-wrap-wide{max-width:860px;margin-inline:auto;padding-inline:28px;}
/* ---- Hero ---- */
#jicci-vision .vision-hero{padding:140px 0 110px;text-align:center;}
#jicci-vision .vision-hero .vision-lead-tag{
font-size:13px;
letter-spacing:.3em;
color:var(--v-font-color);
opacity:.55;
margin-bottom:28px;
}
#jicci-vision .vision-hero h1{
font-size:clamp(30px,4.2vw,44px);
font-weight:500;
line-height:1.75;
letter-spacing:.03em;
}
#jicci-vision .vision-hero p{
margin-top:40px;
font-size:16px;
line-height:2.1;
color:var(--v-font-color);
opacity:.85;
}
#jicci-vision .vision-hero-rule{
width:1px;height:64px;
background:var(--v-rule);
margin:56px auto 0;
}
/* ---- Chapter marker ---- */
#jicci-vision .vision-chapter{padding:0 0 150px;}
#jicci-vision .vision-chapter-num{
font-size:15px;
letter-spacing:.4em;
color:var(--v-font-color);
opacity:.4;
margin-bottom:22px;
text-align:center;
}
#jicci-vision .vision-chapter h2{
font-size:clamp(24px,3vw,30px);
font-weight:500;
text-align:center;
line-height:1.7;
margin-bottom:56px;
}
#jicci-vision .vision-chapter p{
font-size:16px;
line-height:2.15;
margin-top:26px;
}
#jicci-vision .vision-chapter p:first-of-type{margin-top:0;}
/*
* 手動改行（
）で意図的に文の途中に行間を入れている段落用。
* text-align:justify の下では、
の直前の行（続きがある限り「最終行」
* と判定されず）が強制的に均等配置され、文字間が不自然に広がって
* しまうため、該当段落のみ左揃えに切り替えて改行位置の見た目を保つ。
*/
#jicci-vision .vision-lines{text-align:left;}
/* emphasis line (used once per section, max) */
#jicci-vision .vision-emphasis{
text-align:center;
font-size:22px;
font-weight:500;
color:var(--v-main-color);
line-height:1.8;
margin:48px 0;
}
#jicci-vision .vision-emphasis-close{
margin-top:44px;
font-weight:500;
font-size:1.05em;
}
/* 二章：想い・手段の宣言行（インラインスタイルから移植） */
#jicci-vision .vision-wish-line{
text-align:center;
margin-top:48px;
font-size:17px;
}
/* ---- Issues (no diagram, no cards) ---- */
#jicci-vision .vision-issues-lead{
text-align:center;
font-size:16px;
line-height:2.1;
margin-bottom:72px;
}
/* 四章：締めの一文（インラインスタイルから移植） */
#jicci-vision .vision-issues-lead.vision-issues-closing{
margin-top:48px;
margin-bottom:0;
}
#jicci-vision .vision-issues-list{margin-top:0;}
#jicci-vision .vision-issue-row{
display:grid;
grid-template-columns:56px 1fr;
gap:28px;
padding:34px 0;
border-top:1px solid var(--v-rule);
}
#jicci-vision .vision-issue-row:last-child{border-bottom:1px solid var(--v-rule);}
#jicci-vision .vision-issue-num{
font-family:"游明朝","Yu Mincho",serif;
font-size:20px;
opacity:.45;
padding-top:2px;
}
#jicci-vision .vision-issue-body h3{
font-size:16px;
font-weight:500;
margin-bottom:10px;
}
#jicci-vision .vision-issue-body p{font-size:15px;line-height:1.95;margin:0;}
/* ---- Logo meaning (no colored pills) ---- */
#jicci-vision .vision-logo-mark{
width:88px;
height:88px;
margin:0 auto 48px;
display:block;
}
#jicci-vision .vision-logo-terms{
text-align:center;
font-size:17px;
letter-spacing:.08em;
margin-bottom:46px;
color:var(--v-font-color);
opacity:.75;
}
#jicci-vision .vision-logo-terms{word-spacing:.3em;}
/* 五章：脚注（インラインスタイルから移植） */
#jicci-vision .vision-logo-footnote{
font-size:14px;
opacity:.75;
margin-top:30px;
}
/* ---- Future flow (no circles) ---- */
/* 六章：リード文（インラインスタイルから移植） */
#jicci-vision .vision-future-lead{
text-align:center;
margin-bottom:60px;
}
#jicci-vision .vision-flow-list{border-top:1px solid var(--v-rule);}
#jicci-vision .vision-flow-row{
display:grid;
grid-template-columns:70px 1fr;
gap:28px;
padding:30px 0;
border-bottom:1px solid var(--v-rule);
}
#jicci-vision .vision-flow-num{
font-family:"游明朝","Yu Mincho",serif;
font-size:22px;
opacity:.4;
padding-top:2px;
}
#jicci-vision .vision-flow-body h4{font-size:16px;font-weight:500;margin-bottom:8px;}
#jicci-vision .vision-flow-body p{font-size:15px;line-height:1.95;margin:0;opacity:.9;}
#jicci-vision .vision-loop-line{
text-align:center;
font-size:17px;
font-weight:500;
line-height:1.9;
margin-top:56px;
padding-top:36px;
border-top:1px solid var(--v-rule);
}
/* ---- Final message (quiet dark close) ---- */
#jicci-vision .vision-final{
background-color:#2c2a28;
color:#f3efe8;
padding:150px 0 140px;
text-align:center;
}
#jicci-vision .vision-final .vision-chapter-num{color:#f3efe8;opacity:.4;}
#jicci-vision .vision-final h2{
font-size:clamp(26px,3.6vw,36px);
font-weight:500;
line-height:1.85;
margin-bottom:44px;
}
#jicci-vision .vision-final p{
font-size:16px;
line-height:2.2;
opacity:.88;
max-width:560px;
margin-inline:auto;
}
#jicci-vision .vision-final-btn{
display:inline-block;
margin-top:56px;
padding:14px 10px;
border-top:1px solid rgba(243,239,232,.5);
border-bottom:1px solid rgba(243,239,232,.5);
color:#f3efe8;
font-size:15px;
letter-spacing:.12em;
text-decoration:none;
}
#jicci-vision .vision-final-note{
margin-top:40px;
font-size:12px;
opacity:.5;
letter-spacing:.08em;
}
/* 七章：読者への問いかけ（インラインスタイルから移植） */
#jicci-vision .vision-final-reflect{
margin-top:40px;
font-size:12px;
opacity:.7;
letter-spacing:.08em;
}
@media(max-width:600px){
#jicci-vision .vision-hero{padding:100px 0 80px;}
#jicci-vision .vision-chapter{padding-bottom:110px;}
#jicci-vision .vision-wrap,
#jicci-vision .vision-wrap-wide{padding-inline:22px;}
#jicci-vision .vision-logo-terms span + span{border-left:none;padding-left:0;margin-left:0;display:block;margin-top:10px;}
#jicci-vision .vision-issue-row,
#jicci-vision .vision-flow-row{grid-template-columns:40px 1fr;gap:18px;}
}