@charset "utf-8"; /* CSS Document */

.main-content{  overflow: hidden}
.info-list{  display: grid;font-family: "FOT-筑紫B丸ゴシック Std B" !important;grid-template-columns: 7.5em 1fr;height: fit-content;gap: 0 10px;}
.info-list dt, .info-list dd{  padding: 0.7em 0;font-size: 20px;font-weight: bold;}
.info-list dt{  letter-spacing: 0.1em}
.info-list dt::after{  content: ": ";margin-left: 1em}
.pfBox{  display: flex;gap: 2%;align-items: flex-start;/* 追加 */ position: relative;z-index: 99}
.pfBox img{  width: 32%}
.pfBox p{  display: inline-block;background: #e5554f;color: #fff;line-height: 0;padding: 0 0.5em 0.2em;font-size: 18px;margin-bottom: 1em;border-radius: 1em;}
.info-list dt.ls01{ letter-spacing: 0.4em}
.info-list dt.ls02{ letter-spacing: 0.15em}
.peopleCont p{ font-size: 20px;line-height: 1.7em;text-align: justify}
.peopleC01{  position: relative;margin: 5% 0 0;padding-bottom: 1em}
.peopleCont h3{  font-size: 40px;line-height: 2em;margin-bottom: 1em;position: relative;z-index: 99}
.peopleCont h3 span{ display: inline-block;background: #f6e47a;line-height: 1.5em;padding: 0 0.2em}
.peopleC01 p{  width: 49%;}
.peopleC01 p:nth-child(3){  width: 100%;margin-top: 12%}
.peopleC01 p.mt2p{  margin-top: 2%}
.peopleC01 p.mt2em{  margin-top: 2em}
.peopleC01 p.mt8p{  margin-top: 8%}
.peopleC01 img{  width: 67%;position: absolute; top: -6%;right: -22%;}
.people1 .pb23{ padding-bottom: 23%}
.people2 .peopleC01 img{  width: 72%;position: absolute;top: -10%;right: -24%;}
.people5 .peopleC01 img{  width: 60%;position: absolute;top: -12%;right: -15%;}
.people4 .peopleC01 img{  width: 68%;position: absolute;top: -13%;right: -23%;}
.people6 .peopleC01 img{  width: 60%;position: absolute;top: -13%;right: -15%;}
.people7 .peopleC01 img{  width: 74%;position: absolute;top: -9%;right: -27%;}
.people6 .peopleC01 img.tpm6{  top: unset;bottom: 26%;}
.peopleC02{  position: relative;margin: 20% 0 0;padding-bottom: 10%}
.peopleC02 h3{  text-align: right}
.peopleC02 p{  width: 49%;float: right}
.peopleC02 img{  width: 57%;position: absolute;top: -2%;left: -9%;}
.people1 .peopleC02 img{  width: 57%;position: absolute;top: -13%;left: -9%;}
.people5 .peopleC02 img{  width: 54%;position: absolute;top: -17%;left: -5%;}
.people6 .peopleC02 img{  width: 74%;position: absolute;top: -5%;left: -28%;}
.people7 .peopleC02 img{  width: 74%;position: absolute;top: -11%;left: -27%;}
.peopleC02::after{ content: "";clear: both;display: block;}
.peopleC02 p:nth-child(3){  width: 100%;margin-top: 7%}
.CarPath{  background: #dcdddd;}
/* スクロールコンテナの定義 */
.CarPath{  /* 横スクロールを可能にする */ overflow-x: scroll;/* 縦方向のスクロールは禁止 */ overflow-y: hidden;/* ドラッグ操作が可能なことを示すカーソル */ cursor: grab;/* 必要に応じて高さを設定 (ここでは仮に300px) */ height: 150px;}
/* ドラッグ中のカーソル */
.CarPath.is-dragging{  cursor: grabbing;}
/* --- スクロールバーの非表示 --- */
/* 1. WebKit系ブラウザ (Chrome, Safari, Edgeなど) */
.CarPath::-webkit-scrollbar{  display: none;}
/* 2. IE/Edge */
.CarPath{  -ms-overflow-style: none;}
/* 3. Firefox */
/* .CarPath{ 
  scrollbar-width: none; 
}
*/
/* コンテンツ（画像）を包むdiv要素 */
.CarPath > div{  /* 画像の width: 130% が効くようにインライン要素をブロック要素として扱う */ display: block;/* 親要素の高さを継承 */ height: 100%;width: 90%;margin: 0 auto;max-width: 1300px}
/* 画像要素の調整 */
.CarPath img{  /* 画像がコンテナの高さに合わせて表示されるように調整 */ height: 100%;/* width: 130% の指定により、横にはみ出す */ width: 130%;/* 画像が縮まないように */ min-width: 130%;/* 縦方向の比率を保ちつつ、はみ出した部分を隠さない */ object-fit: contain;padding-right: 30%;}
.CarPath img.cpath05{ width: 280%}
.CarPathWrap{ background: #dcdddd;padding: 5% 0 7%;position: relative}
.CarPathWrap h5{  margin: 0 auto;max-width: 900px;font-size: 40px;color: #fff}
.CarPathWrap img.patharrow{ position: absolute;bottom: 13%;width: 8%;right: 0;left: 0;margin: auto}
.pMidV{  position: relative}
.pmidImg{  position: absolute;top: -3.2%;width: 35%;left: 17%;}
.peopleC03{  width: 85%;max-width: 980px;margin: 0 auto;padding-bottom: 5%}
.peopleC03 div{  display: flex;gap: 2%;align-items: flex-start;padding: 3em 0.5em;border-bottom: 2px solid #07223b}
.peopleC03 div h5{  width: 6%}
.peopleC03 div h5 img{  width: 100%;padding-top: 0.5em}
.peopleC03 div p{  width: 83%;font-size: 20px;line-height: 1.7em}
.peopleC01 p.mt3p{  margin-top: 3%}
.peopleC01 p.mt4p{  margin-top: 4%}
.peopleC01 img.w74p{  width: 72%}
.peopleC01 img.w68{  width: 65%;position: absolute;top: -15%;right: -22%;}

.people1 .pb23 {    padding-bottom: 0%;}
#people .peopleflex{  width: 100%}
.people2 .peopleC02 p:nth-child(3){  width: 100%;margin-top: 10%;}
p.mt2p{  margin-top: 2%}
p.mt15p{ margin-top: 15%}
/* ▼▼▼ スマホ向けスタイル (〜959px) ▼▼▼ */
@media screen and (max-width: 959px){  .info-list{  display: grid;grid-template-columns: 6.0em 1fr;height: fit-content;gap: 0 0px;}
.info-list dt, .info-list dd{  padding: 0.4em 0;font-size: 14px;font-weight: bold;line-height: 1.2em;}
.peopleCont{  width: 100%;}
.peopleCont p{  font-size: 14px;width: 90%;padding-top: 7em;margin: 0 auto;}
.peopleCont .peopleC02 p{  font-size: 14px;width: 90%;padding-top: 8em;margin: 0 auto;}
.pdt4em{ padding-top: 4em !important}
.peopleCont .peopleC02 .f4lin + div p{  padding-top: 7em;}
.peopleCont h3{  font-size: 15px;left: 5%;position: absolute;top: 1.5em}
.peopleC01 img ,.people2 .peopleC01 img ,.people4 .peopleC01 img,.people5 .peopleC01 img,.people6 .peopleC01 img,.people7 .peopleC01 img{  width: 54%;/* padding-left: 3%; */ position: relative;top: unset;right: -3%;}
.peopleCont .peopleC02 h3{ left: unset;top: -5%;right: 5%;}
.people6 .peopleC01 img{  padding-top: 3%}
.peopleCont h3.f3lin{ top: 0.5em;}
.peopleCont h3.f4lin{ top: -1.5em;}
.peopleCont h3.f5lin{ top: -2.5em;}
.peopleCont h3.f6lin{ top: -1.5em;}
.peopleCont p.pt115em{ padding-top: 11.5em}
.peopleC02{  margin: 8% 0 0;padding-bottom: 0}
.people1 .peopleC02 img , .peopleC02 img ,.people5 .peopleC02 img, .people6 .peopleC02 img, .people7 .peopleC02 img{  width: 54%;position: relative;top: unset;left: -3%;padding-top: 3%;}
.peopleC02 p{  width: 90%;float: none}
.CarPathWrap h5{  font-size: 20px;padding-left: 2em;}
.CarPath img{ width: 350%;min-width: 230%;}
.CarPathWrap img.patharrow{ position: absolute;bottom: 13%;width: 25%;right: 0;left: 0;margin: auto;max-width: 90px;}
.pmidImg{  top: -4.45%;width: 53%;left: 6%;}
.peopleC03{  width: 100%;}
.peopleC03 div{  gap: 4%;padding: 1em 0;width: 90%;margin: 0 auto;}
.peopleC03 div p{ width: 95%;font-size: 14px;}
.peopleC03 div h5 img{  padding-top: 5px}
.peopleC01 img.w74p{  width: 66%;position: absolute;top: -2%;right: -19%;}
.peopleC01 img.w68{  width: 68%;position: absolute;top: -5%;right: -22%;}
.CarPath img.cpath05{ width: 700%}
.pfBox p{  padding: 0 0.5em;}
.pfBox{  width: 90%;margin: 0 auto;}
.peopleCont .peopleC01 p:nth-child(3) , .peopleCont .peopleC02 p:nth-child(3){  margin-top: 00.5em!important;margin-bottom: 0;width: 90%;padding-top: 1em !important;}
.peopleC01{  position: relative;margin: 5% 0 0;padding-bottom: 0;}
.pfBox{  align-items: flex-end;}
.pfBox2{  width: 90%;margin: 0.5em auto;}
.pfBox2 .info-list{  display: grid !important;}
.pfBox p{ width: unset}
.article-wrapper{  margin-bottom: 10px;position: relative;}
.expanded{  margin-bottom: 0}
/* スマホ時の通常（閉じている）スタイル */ .article-content{  display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 7;/* 5行で末尾を「…」にする */ overflow: hidden;transition: height 0.5s ease-in-out;}
/* 展開中・展開後のスタイル */ .article-wrapper.expanded .article-content{  display: block;-webkit-line-clamp: unset;}
/* ボタンを表示してスタイリング */ .read-more-btn{  display: block;margin: 1em auto;padding: 10px 0;/* background-color: #fff; */ border-top: 1px solid #00243f;color: #00243f;font-size: 14px;cursor: pointer;/* border-radius: 20px; */ transition: all 0.3s;outline: none;width: 90%;border-bottom: 1px solid #00243f;}
.read-more-btn::after{  content: " ▼";font-size: 10px;margin-left: 5px;}
.read-more-btn.open::after{  content: " ▲";}
.fr{  float: right}
.fl{  float: left}
.af::after{  content: "";/* 1. 挿入するコンテンツは空 */ display: table;/* 2. テーブルとして表示 (IE 6/7のfloat問題対応と、ボックスの振る舞いを修正) */ clear: both;/* 3. floatの回り込みを解除する */}
.peopleCwrap{ width: 100%}
#people .peopleflex{  width: 90%;}
}
/* --- PC用（769px以上）のスタイル --- */
@media (min-width: 960px){  .article-content{  /* 強制的に全文表示 */ display: block !important;height: auto !important;overflow: visible !important;-webkit-line-clamp: unset !important;}
/* PCではボタンを隠す */ .read-more-btn{  display: none;}
}