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

/* ファーストビュー（見出し） */
div.first-view { background-image:url('../img/page/hs-nanohana-makuhari/first-view-bg.png'); }

/* テキスト用 */
.content-text p, .content-text li, .content-text dt, .content-text dd { font-size:16px; font-weight:400; line-height:200%; letter-spacing:-0.8px; }

/* リスト */
ul.disc-list { padding:0 20px; }
ul.disc-list li { list-style-type:disc; }
ul.attention-list li { text-indent:-1rem; padding-left:1rem; }
ul.attention-list li::before { content:'※'; }
ol.nmb-list { list-style-type:decimal; padding-left:20px; }
ol.annnai ul.disc-list { margin-bottom:0; }
ol.annnai li { margin:10px 0; }
ol.annnai li ul.disc-list li { margin:0; }

/* 並び調整用 */
div.table-chosei { flex-direction:column; gap:24px; margin-bottom:40px; }
div.table-item h3 { color:var(--bl); font-size:16px; font-weight:800; line-height:200%; }
div.table-item h3 span { color:var(--bk); font-weight:400; }
div.table-item p { font-size:16ox; font-weight:400; line-height:200%; letter-spacing:-0.8px; }
table.hyo { margin:8px 0; }
table.hyo td { vertical-align:middle; }

/* テーブル調整 */
table.hyo tr td { padding:10px; width:50%; }
table.hyo tr td.td-left { text-align:left; }

/* 余白設定 */
.content-text { margin-bottom:40px; }

/* 幕張事業所エリアのご案内（住所） */
.area-about { margin:24px auto 0 auto; max-width:275px; }
.area-about dt { color:var(--bl); font-size:18px; font-weight:800; line-height:200%; text-align:center; }
.area-about dd { font-size:18px; font-weight:400; line-height:32px; letter-spacing:-0.9px; }

/* レスポ設定 */
.table-item .sp-only { display:block; }
.table-item .pc-only { display:none; }

@container( min-width:960px ) {

/* イラスト配置 */
section.content-block.top-content::before { aspect-ratio:205/195; background-image:url('../img/page/hs-nanohana-makuhari/top-content-illustration.png'); top:150px; left:calc( 260px / 2 ); transform:translateX(-65px); width:205px; height:195px; }
.annnai { position:relative; z-index:1; }
.annnai::before { aspect-ratio:341/239; background-size:contain; background-position:center; background-image:url('../img/page/hs-nanohana-makuhari/content-illustration01-pc.png'); content:''; display:inline-block; position:absolute; top:-130px; right:-150px; height:239px; width:341px; z-index:-1; }

/* ベース */
.content-text { margin:auto auto 80px auto; max-width:830px; width:100%; }

/* テーブル調整 */
table.hyo { table-layout:fixed; }
table.hyo tr td { padding:5px 10px; width:auto; }
table.hyo tr td.td-title { width:150px; }

/* 並び調整用 */
div.table-chosei { gap:40px; margin:auto; margin-bottom:80px; max-width:830px; width:100%; }
div.table-item h3 { font-size:18px; text-align:center; }
div.table-item { text-align:center; }
div.table-item p { display:inline-block; text-align:left; margin:auto; }
div.cancel .hyo td.bl-01 { text-align:left; padding:10px 25px; width:300px; }

/* テキスト用 */
.content-text p, .content-text li, .content-text dt, .content-text dd, div.table-item p { font-size:18px; line-height:32px; letter-spacing:-0.9px; }

/* 利用者様の声 */
div.pc-fukudashi { align-items:center; display:flex; justify-content:center; margin:0 auto; max-width:830px; width:100%; }
div.pc-fukudashi div.voice { aspect-ratio:760/438; background-size:contain; background-repeat:no-repeat; background-position:center; background-image:url('../img/page/hs-nanohana-makuhari/fukidashi.png'); display:flex; flex-direction:column; justify-content:center; overflow:hidden; padding:30px 70px; max-height:438px; height:438px; max-width:820px; width:820px; }
div.pc-fukudashi div.voice .content-text { overflow-y:auto; padding:0 30px; margin:0; width:auto; }
div.pc-bba { aspect-ratio:162/174; background-repeat:no-repeat; background-size:contain; background-position:center; background-image:url('../img/page/hs-nanohana-makuhari/content-illustration02-pc.png'); height:120px; width:120px; }
div.pc-fukudashi div.voice ul li { font-size:16px; }

/* レスポ設定 */
.table-item .sp-only { display:none; }
.table-item .pc-only { display:block; }

/* 幕張事業所エリアのご案内（住所） */
.area-about { align-content:flex-start; display:flex; justify-content:center; gap:24px; max-width:100%; }

}
