/* ============================== */
/* 汎用設定 */
/* ============================== */

/* カラーパレット */
:root {
--bg:#f7fcf2;
--bk:#241a19;
--bl:#4872be;
--gr-1:#31641f;
--or:#d36a34;
--wh:#fff;
}

/* 全体 */
html { background-color:var(--bg); color:var(--bk); font-family:"Noto Sans JP", sans-serif; font-weight:400; line-height:1.7; }
body { display:flex; flex-direction:column; margin:0; min-height:100vh; min-height:100svh; }
main { flex-grow:1; }

/* 色 */
.gr-1 { color:var(--gr-1); }

/* 太さ */
.w500 { font-weight:500; }
.w600 { font-weight:600; }
.w900 { font-weight:900; }

/* フォント */
.min { font-family:"Noto Serif JP", serif; }

/* レイアウト用 */
.l-container { container:layout / inline-size; }

/* ============================== */
/* ヘッダ */
/* ============================== */

/* ヘッダ・ベース */
.site-header { align-items:center; background-color:var(--gr-1); color:var(--wh); padding:0 20px; height:72px; width:100%; }

/* 見出し */
.site-title { align-items:center; font-size:18px; font-weight:600; gap:11px; }

@media( min-width:769px ) {

/* ヘッダ・ベース */
.site-header { padding:0 30px; height:44px; }

/* 見出し */
.site-title { font-size:18px; gap:30px ; }

}

/* ============================== */
/* メイン */
/* ============================== */

/* 汎用 */
.content h2 { background-color:var(--gr-1); color:var(--wh); font-size:16px; line-height:161%; padding:5px 20px; margin-bottom:40px; }
.content p { font-size:14px; line-height:170%; letter-spacing:0.98px; }
.content a { color:var(--bl); }

@container( min-width:769px ) {

.content h2 { font-size:24px; padding:7px; }
.content h2 .title-layout { display:block; margin:auto; max-width:1000px; }

}

/* ============================== */
/* 生活保護費引き下げを… */
/* ============================== */

/* 見出し */
.first-content h1 { background-image:url(../img/main-image.webp); background-repeat:no-repeat; background-position:top center; background-size:cover; justify-content:center; padding:66px 12px 24px 12px; margin-bottom:40px; }
.first-content h1 img { margin:auto; }

/* コンテンツ */
.first-content { margin-bottom:40px; }
.first-content .content-box { padding:0 20px; margin:auto; max-width:calc( 100% - 7.5% ); }
.first-content p { font-size:14px; line-height:170%; letter-spacing:0.98px; padding:0 10px; }
.first-content .label-text { background-color:var(--wh); border:1px solid var(--gr-1); border-left:6px solid var(--gr-1); border-radius:5px; box-sizing:border-box; color:var(--gr-1); font-size:15px; letter-spacing:0.45px; line-height:161%; padding:20px 37px; margin-bottom:16px; }
.index { align-items:center; background-color:var(--wh); border:1px solid var(--gr-1); border-radius:2.5px; justify-content:space-between; margin-top:24px; overflow:hidden; padding:20px 21px; position:relative; z-index:0; }
.index::before { background-color:var(--bg-eb, #f7f8eb); clip-path:polygon(35% 51.27%, 60.42% 0, 100% 0, 100% 100%, 60.42% 100%); content:""; inset:0; position:absolute; z-index:-1; }
.index h2 { color:var(--gr-1); font-size:18px; line-height:161%; width:40%; }
.index-list { gap:8px; }
.index-list li { font-size:14px; line-height:161%; }

@container( min-width:769px ) {

/* 見出し */
.first-content h1 { font-size:30px; padding:161px 0 62px 0; margin-bottom:70px; max-width:100%; }
.first-content h1 img { height:auto; max-width:100%; }
.index h2 { font-size:24px; text-align:center; width:50%; }

/* コンテンツ */
.first-content { margin-bottom:50px; }
.first-content .content-box { max-width:1000px; }
.first-content .label-text { font-size:22px; padding:24px 100px; margin-bottom:20px; }
.first-content p { font-size:18px; line-height:200%; letter-spacing:0.6px; padding:0 10px; }
.index { margin:auto; margin-top:35px; max-width:742px; }
.index-list { gap:17px; width:50%; }
.index-list li { font-size:18px; }

}

/* ============================== */
/* 審査請求について */
/* ============================== */

/* 見出し */
.request h3 { color:var(--or); font-size:15px; line-height:161%; margin-top:40px; margin-bottom:16px; } 

/* コンテンツ */
.request .content-box { padding:0 20px; margin:auto; max-width:calc( 100% - 7.5% ); }
.request p { font-size:14px; line-height:161%; letter-spacing:2.24px; padding:0 10px; }
.request .label-text { background-color:var(--wh); border:1px solid var(--or); border-left:6px solid var(--or); border-radius:5px; box-sizing:border-box; color:var(--or); font-size:15px; letter-spacing:-0.9px; line-height:161%; padding:20px 15px; margin-bottom:16px; }
.indent { text-indent:-1rem; margin-top:24px; }
.marker { border-bottom:2px solid #eeb154; }

/* リスト */
.button-list { flex-direction:column; gap:16px; margin-bottom:40px; }
.button-list img { height:auto; max-width:100%; }
.button-list a { transform:opacity .3s; opacity:1; }
.button-list a:hover { transform:opacity .3s; opacity:0.6; }

@container( min-width:769px ) {

/* 見出し */
.request h3 { font-size:22px; margin-bottom:20px; margin-bottom:38px; }
.request h3 br { display:none; }

/* コンテンツ */
.request .content-box { max-width:1000px; }
.request p { font-size:18px; line-height:200%; letter-spacing:1.2px; }
.request .label-text { font-size:22px; padding:24px 100px; }

/* リスト */
.button-list { flex-direction:row; gap:56px; justify-content:center; margin-bottom:100px; }

}

/* ============================== */
/* 会員の声 */
/* ============================== */

/* 見出し */
.voice-box h3 { align-items:center; gap:17px; margin-bottom:16px; }
.voice-box h3 img { width:80px; }
.box-title { font-size:14px; gap:9px; line-height:100%; letter-spacing:-0.14px; }

/* コンテンツ */
.voice .content-box { padding:0 20px; margin:auto; max-width:calc( 100% - 7.5% ); }
.voice-box { background-color:var(--wh); padding:20px; margin-bottom:24px; }

@container( min-width:769px ) {

/* 見出し */
.voice-box h3 { justify-content:space-between; margin-bottom:30px; }
.voice-box h3 img { width:100px; }
.box-title { font-size:20px; gap:16px; }

/* コンテンツ */
.voice .content-box { padding-bottom:60px; max-width:1000px; }
.voice-box { padding:40px 100px; margin-bottom:40px; }
.voice-box p { font-size:18px; letter-spacing:0.48px; line-height:200%; }

}

/* ============================== */
/* ご相談は各地の「生活と健康を守る会」へ */
/* ============================== */

/* コンテンツ */
.consultation { background-color:#e6eac6; padding-bottom:40px; }
.consultation .content-box { padding:0 20px; margin:auto; max-width:calc( 100% - 7.5% ); }
.consultation p { font-size:16px; }
.consultation p a { color:var(--bl); font-size:12px; line-height:100%; letter-spacing:-0.48px; }

@container( min-width:769px ) {

/* 見出し */
.consultation h2 { margin-bottom:70px; }

/* コンテンツ */
.consultation .content-box { padding-bottom:30px; max-width:800px; }
.consultation p { font-size:20px; line-height:200%; }
.consultation p a { font-size:16px; line-height:200%; }

}

/* ============================== */
/* 関連リンク */
/* ============================== */

/* コンテンツ */
.link .content-box { display:flex; flex-direction:column; gap:16px; padding:0 20px; padding-bottom:40px; margin:auto; max-width:calc( 100% - 7.5% ); }
.link .content-box h2 { margin-bottom:24px; }
.link p a { font-size:12px; line-height:200%; letter-spacing:-0.48px; }

@container( min-width:769px ) {

/* コンテンツ */
.link .content-box { max-width:1000px; }
.link p { font-size:18px; line-height:200%; letter-spacing:1.2px; }
.link p.explanation { font-size:20px; padding:0 80px; }
.link p.explanation a { font-size:16px; }

}

/* ============================== */
/* フッタ */
/* ============================== */

/* コピーライト */
.copy { background-color:var(--gr-1); color:var(--wh); font-size:12px; font-weight:600; line-height:133%; padding:10px 20px; }