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

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

@container(min-width:960px) {

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

}


/* ==================================================================================================== */
/* 活動紹介 */
/* ==================================================================================================== */

/* ベース */
section.activities { background-color:var(--wh); padding:40px 20px; margin:auto; margin-bottom:70px; position:relative; z-index:1; }
section.activities::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.wd-news { background-color:var(--wh); padding:40px 20px; margin:auto; margin-bottom:40px; }

/* 見出し */
section.content-block h2 { color:var(--gr-1); font-size:18px; font-weight:500; line-height:30px; letter-spacing:-0.9px; margin-bottom:16px; }

/* リスト */
section.activities ul { display:flex; flex-direction:column; gap:16px; }
section.activities ul li { font-size:16px; font-weight:500; line-height:200%; padding:0 16px; }
section.activities ul li::before { aspect-ratio:36.5/60; background-size:contain; background-position:center; background-repeat:no-repeat; content:''; display:block; text-align:center; margin:auto; height:60px; width:35px; }
section.activities ul li:nth-child(1):before { background-image:url(../img/activities/count-1.png); }
section.activities ul li:nth-child(2):before { background-image:url(../img/activities/count-2.png); }
section.activities ul li:nth-child(3):before { background-image:url(../img/activities/count-3.png); }
section.activities ul li:nth-child(4):before { background-image:url(../img/activities/count-4.png); }

/* サムネイル */
ul.samune-list { align-items:center; flex-direction:column; flex-wrap:wrap; gap:24px; justify-content:center; margin-bottom:8px; }
ul.samune-list li { text-align:center; }
ul.samune-list li img { margin:auto; max-width:100%; width:100%; }

/* PDF拡大リンク */
p.expansion { font-size:16px; font-weight:300; text-align:center; line-height:30px; letter-spacing:-0.8px; margin-bottom:40px; }
p.expansion a::after { align-content:1/1; background-image:url(../img/activities/arrow-icon.svg); background-repeat:no-repeat; background-size:contain; background-position:center; content:''; display:inline-block; margin-left:8px; height:16px; width:16px; }

/* 本文 */
div.news-content h3 { color:var(--gr-1); font-weight:500; line-height:200%; }
div.news-content p, div.news-content ul li { font-size:16px; font-weight:300; line-height:30px; letter-spacing:-0.8px; margin-bottom:40px; }
div.news-content img { display:block; text-align:center; margin:auto; margin-bottom:40px; height:auto; max-width:100%; width:100%; }

@container(min-width:960px) {

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

/* 見出し */
section.content-block h2 { font-size:24px; text-align:center; line-height:200%; margin-bottom:40px; }

/* リスト */
section.activities ul { padding:40px 0; justify-content:flex-start; }
section.activities ul li { align-items:center; display:flex; }
section.activities ul li::before { display:inline-block; margin-right:24px; margin-left:0; }

/* サムネイル */
ul.samune-list { flex-direction:row; gap:40px; }
ul.samune-list li { width:calc( 50% - 20px ); }

/* 本文 */
div.news-content p, div.news-content ul li { line-height:200%; }
div.news-content img { max-width:750px; }

}
