/* -----------------------------------
   ページ内リンクの固定ヘッダー分ずれ回避
   ----------------------------------- */
section.anchor {
    padding-top: 50px;
    margin-top:-50px;
}


/* -----------------------------------
   インデックスリスト
   ----------------------------------- */
/* 白背景、右に矢印 */
.indexList	{
  list-style: none;
  padding: 0;
  margin: 0;
  border-top: 1px solid #ddd; /* リストの上に薄い線 */
}

.indexList li	{
  display: flex;
  align-items: center;              /* 縦中央揃え */
  justify-content: space-between;   /* テキストとアイコンを両端に配置 */
  padding: 3.4cqw 2cqw 3.4cqw 4cqw ;	    /* 上 | 右 | 下 | 左 */
  border-bottom: 1px solid #ddd; /* 下線 */
}
	
.indexList a {
  text-decoration: none; /* 下線を消す */
  color: #000000;	 /* テキストカラー */
  font-weight: 500; /* 500=Medium */
  font-size: 4.2cqw;	 /* フォントサイズ */
  letter-spacing: -0.05em; /* 文字間隔 */
  flex: 1;               /* アイコンを右に寄せるためリンクを広げる */}

.indexList li::after {
  /* Font Awesome アイコン (fa-chevron-right) の表示に必要なプロパティ */
  content: "\f054"; /* fa-chevron-right の Unicode */
  font-family: "Font Awesome 7 Free"; 
  font-weight: 900; /* Solid アイコン用 */

  /* スタイルの適用 */
  color: #C0C0C0; /* アイコンの色 */
  font-size: 3.8cqw; /* アイコンサイズ */
  
  /* Flexbox内での調整 */
  margin-left: 2cqw; /* リンクテキストとの間隔を確保 */
  flex-shrink: 0; /* アイコンが縮まないように固定 */
}


/* -----------------------------------
   下線（文章は改行しないで<span>で囲む）
   ----------------------------------- */
/* 色（#D7EEFF）つきの太い下線（少し下線が文字と重なる） */
.colorful-underline {
    position: relative;
    display: inline-block;
}
.colorful-underline::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: -0.12em; /* 文字の下端より少し下に配置 */
    height: 0.7em;  /* 下線の太さ */
    background: #D7EEFF;
    mix-blend-mode: multiply; /* ← 文字の下に自然に馴染む */
}

/* 色（#DCFFA4）つきの太い下線（少し下線が文字と重なる） */
/* 発達支援チーム長の挨拶 */
.colorful-underline2 {
    position: relative;
    display: inline-block;
}
.colorful-underline2::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: -0.12em; /* 文字の下端より少し下に配置 */
    height: 0.7em;  /* 下線の太さ */
    background: #DCFFA4;
    mix-blend-mode: multiply; /* ← 文字の下に自然に馴染む */
}


/* スタッフのボックス（クエリコンテナ対応） ::::::::::::::::::::::::::::::::::::::: */
.box-staff {
    width: 90cqw;
    /* height: 72cqw; */ /* 高さを決めない */
    /* padding: 5cqw; */
    background: #F2F2F2;        /* Lightgrey */
    border: none;
    border-radius: 3cqw;
    box-sizing: border-box;     /* パディング込みで90cqwに収める */
    margin-inline: auto;        /* ← 中央配置の決め手 */
    display: flex;              /* 中の要素を自然に縦積み */
    flex-direction: column;
    /* gap: 2cqw; */            /* 任意：要素間の余白 */
}


/* -----------------------------------
   写真の角を丸く
   ----------------------------------- */
.img-rounded {
    border-radius: 3cqw;
}

/* -----------------------------------
   写真の背後に花びらを設置
   ----------------------------------- */
/* 親要素：位置の基準点にする */
.relative-box {
    position: relative;
    overflow: hidden; /* 花びらが画面からはみ出した場合に横スクロールが出るのを防ぐ */
}

/* 花びら画像の設定 */
.bg-hanabira1 {
    position: absolute;
    width: 32.8cqw;   /* 画面幅の32.8% */
    right: 0;         /* 右端に接する */
    
    /* 配置の計算：
       img_centacho1.jpg の上端より 32.8cqw 分上に配置 
       親から、top: 2～6cqw あたりで調整
    */
    top: 4cqw; 
    
    z-index: 0;       /* テキストより後ろに配置 */
    pointer-events: none; /* 画像が文字へのクリックを邪魔しないようにする */
}

.bg-hanabira2 {
    position: absolute;
    width: 29.7cqw;   /* 画面幅の29.7% */
    left: 0;          /* 左端に接する */
    top: 6cqw;        /* 配置の調整 */
    z-index: 0;       /* テキストより後ろに配置 */
    pointer-events: none; /* 画像が文字へのクリックを邪魔しないようにする */
}

.bg-hanabira3 {
    position: absolute;
    width: 31.3cqw;   /* 画面幅の31.3% */
    right: 0;         /* 右端に接する */
    top: 6cqw;        /* 配置の調整 */
    z-index: 0;       /* テキストより後ろに配置 */
    pointer-events: none; /* 画像が文字へのクリックを邪魔しないようにする */
}

.bg-hanabira4 {
    position: absolute;
    width: 25.0cqw;   /* 画面幅の25.0% */
    right: 0;         /* 右端に接する */
    top:12cqw;        /* 配置の調整 */
    z-index: 0;       /* テキストより後ろに配置 */
    pointer-events: none; /* 画像が文字へのクリックを邪魔しないようにする */
}

.bg-hanabira5 {
    position: absolute;
    width: 21.1cqw;   /* 画面幅の21.1% */
    left: 0;          /* 左端に接する */
    top: 2cqw;        /* 配置の調整 */
    z-index: 0;       /* テキストより後ろに配置 */
    pointer-events: none; /* 画像が文字へのクリックを邪魔しないようにする */
}

.bg-hanabira6 {
    position: absolute;
    width: 29.7cqw;   /* 画面幅の29.7% */
    right: 0;         /* 右端に接する */
    top: 8cqw;        /* 配置の調整 */
    z-index: 0;       /* テキストより後ろに配置 */
    pointer-events: none; /* 画像が文字へのクリックを邪魔しないようにする */
}

/* テキストとメイン写真：花びらより前に出す */
.relative-text {
    position: relative;
    z-index: 1;
}


/* -----------------------------------------------------------
   リンク案内
   ----------------------------------------------------------- */
/* リンク案内のタイトル */
.l_title {
	display: flex;               /* Flexboxを有効化 */
	justify-content: center;    /* 水平方向に中央揃え */
	margin:0 auto; /* 横方向の中央揃え */
}


/* リンク案内のBOX */
.l_box {
	display: flex;               /* Flexboxを有効化 */
	justify-content: center;    /* 水平方向に中央揃え */
	align-items: center;        /* 垂直方向に中央揃え */
	width:84cqw;
	height:11cqw;
	margin:0 auto; /* 横方向の中央揃え */
	line-height:11cqw;
	background:#418FD6;
	color:#fff;
	border-radius:5.5cqw;
	text-align:center;
}

.l_box a {
	text-decoration:underline;
}