/* ==================================================================================================== */
/* 汎用 */
/* ==================================================================================================== */

/* 見出し */
.page-title { text-align:center; padding-top:40px; margin-bottom:18px; }
.page-title img { margin:auto; max-width:269px; }

@container(min-width:960px) {

/* 見出し */
.page-title { padding-top:50px; margin-bottom:80px; }
.page-title img { max-width:368px; }

}

/* ==================================================================================================== */
/* 婦団連とはメインコンテンツ */
/* ==================================================================================================== */

/* ベース */
section.about-top-block { background-color:var(--wh); padding:40px 30px; margin-bottom:40px; }
div.about-content { margin-bottom:40px; }

/* 見出し */
div.about-content h3, section.group-list h3 { color:var(--gr-1); font-size:24px; font-weight:500; line-height:32px; }
div.about-content h3 { margin-bottom:24px; }
section.group-list h3 { align-items:center; justify-content:center; position:relative; margin-bottom:16px; white-space:nowrap; z-index:1; }
section.group-list h3::before, section.group-list h3::after { background-color:var(--gr-1); content:''; flex:1; height:1px; }
section.group-list h3::before { margin-right:16px; }
section.group-list h3::after { margin-left:16px; }

/* テキスト */
div.about-content p { font-size:16px; font-weight:300; line-height:30px; letter-spacing:-1.12px; }
div.about-content a { color:var(--gr-3); text-decoration:underline; }

/* アイキャッチ */
div.about-ph { text-align:center; margin:auto; margin-bottom:40px; }
div.about-ph img { aspect-ratio:39/59; margin:auto; margin-bottom:10px; height:auto; max-width:234px; width:234px; }
.about-cap { text-align:center; }

/* 加盟団体リスト */
section.group-list p, section.group-list ul li { color:var(--bk); font-size:16px; font-weight:300; line-height:30px; }

@container(min-width:960px) { 

/* ベース */
section.about-top-block { background-color:transparent; padding:0; }
section.main-about { align-items:center; background-color:var(--wh); display:flex; justify-content:space-between; gap:40px; padding:40px; margin:auto; max-width:1000px; }

/* 見出し */
section.group-list h3 { margin:auto; margin-bottom:0; max-width:60%; }
section.group-list h3::before { margin-right:40px; }
section.group-list h3::after { margin-left:40px; }

/* テキスト */
div.about-content { max-width:calc( 100% - 347px ); }

/* アイキャッチ */
div.about-ph { margin-bottom:0; }
div.about-ph img { max-width:307px; width:307px; }

/* 加盟団体リスト */
section.group-list { align-items:center; aspect-ratio:982/804; background-size:cover; background-position:center; background-image:url(../img/about/fukidashi.png); background-repeat:no-repeat; display:flex; flex-direction:column; gap:40px; transform:translateY(-60px); margin:auto; margin-bottom:20px; max-width:1000px; width:100%; }
section.group-list ul { align-items:flex-start; display:flex; flex-wrap:wrap; justify-content:flex-start; margin:auto; margin-top:0; max-width:75%; }
section.group-list ul li { width:50%; }

}

/* ==================================================================================================== */
/* 会則より */
/* ==================================================================================================== */

/* ベース */
section.constitution { background-color:var(--wh); padding:40px 30px; position:relative; margin-bottom:80px; z-index:1; }
section.constitution::before { background-image:url(../img/top/05signature/ruled-lines-sp.svg); background-position:center top; background-size:auto 16px; background-repeat:repeat; content:''; position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); height:calc( 100% - 80px ); width:calc( 100% - 40px ); z-index:-1; }

/* 見出し */
section.constitution h3 { color:var(--gr-1); font-size:24px; font-weight:500; line-height:32px; margin-bottom:24px; }

/* テキスト */
section.constitution p, section.constitution ol li { font-size:16px; font-weight:300; line-height:30px; letter-spacing:-0.32px; }

/* リスト */
section.constitution ol li { counter-increment:number; letter-spacing:-0.8px; padding-left:2.2em; position:relative; z-index:1; }
section.constitution ol li::before { font-weight:400; content:counter(number)'.'; letter-spacing:0.8px; text-align:right; position:absolute; left:0; top:0; width:1.8em; }

@container(min-width:960px) {

/* ベース */
section.constitution { padding:60px; margin:auto; margin-bottom:160px; max-width:1000px; width:100%; }
section.constitution::before { background-image:url(../img/top/05signature/ruled-lines-pc.svg); height:calc( 100% - 100px ); width:calc( 100% - 80px ); }

/* リスト */
section.constitution ol { padding-bottom:20px; }

}

/* ==================================================================================================== */
/* 国際民主婦人連盟（国際民婦連・WIDFとは） */
/* ==================================================================================================== */

/* ベース */
section.widf { margin-bottom:78.92px; }
div.widf-content { background-color:var(--wh); padding:40px 20px; }

/* 見出し */
section.widf h2 { text-align:center; margin-bottom:16px; }
section.widf h2 img { margin:auto; height:auto; max-width:347px; width:100%; }
div.widf-content h3 { color:var(--gr-1); margin-bottom:16px; line-height:200%; }
div.widf-content h3 span.widf-title-01, div.widf-content h3 span.widf-title-02 { display:block; }
div.widf-content h3 span.widf-title-01 { font-size:24px; font-weight:500; text-align:left; }
div.widf-content h3 span.widf-title-01 span.small-deco { font-size:16px; font-weight:300; line-height:30px; letter-spacing:-1.44px; }
div.widf-content h3 span.widf-title-02 { font-size:16px; font-weight:300; }

/* テキスト */
div.widf-content p { font-size:16px; font-weight:300; line-height:30px; }

@container(min-width:960px) {

/* ベース */
div.widf-content { padding:80px; margin:auto; margin-bottom:116px; max-width:1006px; width:100%; }

/* 見出し */
section.widf h2 { margin-bottom:40px; }
section.widf h2 img { max-width:884px; }
div.widf-content h3 { align-items:center; display:flex; gap:8px; justify-content:center; position:relative; z-index:1; }
div.widf-content h3 span.widf-title-01 span.small-deco { font-size:24px; font-weight:500; }
div.widf-content h3 span { display:inline-block; position:relative; white-space:nowrap; z-index:1; }
span.widf-divider { background-color:var(--gr-1); height:1px; width:36px; }

}