@charset "utf-8"; /* reset.css の内容 (基本的なリセット) */
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, time, mark, audio, video{  margin: 0;padding: 0;border: 0;outline: 0;font-size: 100%;vertical-align: baseline;background: transparent;-webkit-text-size-adjust: 100%;font-feature-settings: "palt";}
body{  line-height: 1;font-family: "FOT-筑紫B丸ゴシック Std B" !important;/* font-display: swap !important; -> removed invalid property */ font-optical-sizing: auto;font-style: normal;color: #00243F;}
article,aside,details,figcaption,figure, footer,header,hgroup,menu,nav,section{  display: block;}
nav ul{  list-style: none;}
blockquote, q{  quotes: none;}
blockquote:before, blockquote:after, q:before, q:after{  content: '';content: none;}
a{  margin: 0;padding: 0;font-size: 100%;vertical-align: baseline;background: transparent;text-decoration: none;/* リンクの下線を削除 */ color: inherit;}
/* aにマウスオーバーしたときの下線 */
a:hover{  opacity: 0.7 !important;}
img{  vertical-align: top;height: auto;}
button{  cursor: pointer;background: none;border: none;padding: 0;font-family: inherit;color: inherit;}
/* --- ユーティリティ --- */
.container{}
.pc{  display: inline-block}
.sp{  display: none !important}
.mt2em{  margin-top: 2em!important}
.mb2em{  margin-bottom: 2em!important}
body.no-scroll{  overflow: hidden;/* スクロールを禁止 */ width: 100%;/* position: fixed; と合わせて使用 */}
/* --- メインビジュアル --- */
#top .mv{  margin: 0 auto;max-width: 1920px;width: 90%;line-height: 0;padding-top: 75px;text-align: center;background: none;padding-bottom: 0}
.mv{  width: 100%;background: #00243F;text-align: center;padding: 75px 0}
.mv img{  width: 25%}
.phMv , .ab30qmv{  background: none;padding: 0}
.phMv img , .ab30qmv img{  width: 100%;}
/* --- 縦型項目のセクション --- */
.vertical-headings-section{  padding: 0;text-align: center;margin: 0 auto;width: 65%;max-width: 1300px;position: relative;z-index: 99;}
.vertical-headings-title{  font-size: 2.5rem;font-weight: bold;margin-bottom: 60px;letter-spacing: 0.1em;color: #333;}
.vertical-headings-wrap{  display: flex;justify-content: center;gap: 20px;}
.vertical-heading-item{  cursor: pointer;display: flex;align-items: center;justify-content: center;transition: transform 0.3s ease, box-shadow 0.3s ease;border: 2px solid transparent;/* ホバー効果のために用意 */}
/*.vertical-heading-item img{  filter: drop-shadow(5px 5px 5px rgba(35, 24, 21, 0.6))}
*/

.vertical-heading-item:hover{  transform: translateY(-5px);}
.vertical-heading-item img{ filter: drop-shadow(5px 5px 5.1px rgba(35, 24, 21, 0.6));/* ぼかしを小数にする */;transform: translateZ(0);-webkit-backface-visibility: hidden;/* Safari向けの指定 */}
.vertical-heading-item img:first-child{ transition: transform 0.2s ease-in-out;}
.vertical-heading-item img:first-child:hover{  transform: scale(1.015);}
.vertical-heading-item:nth-child(2n){  margin-top: 6%}
.vertical-heading-item:hover .vertical-text{  color: #333;/* ホバーで色を変えるなど */}
.tabtx{  position: absolute;top: 2%;filter: none !important}
.vertical-heading-item:nth-child(2n) .tabtx{ top: -5%;}
/* --- モーダルのスタイル (既存 + ギャラリー用追加) --- */
.modal{  position: fixed;top: 0;left: 0;width: 100%;height: 100%;background-color: rgba(0, 0, 0, 0.8);display: none;align-items: center;justify-content: center;z-index: 2000;overflow-y: auto;/* モーダルが画面より大きい場合にスクロール可能にする */}
.modal.is-open{  display: flex;}
.modal-content{  background-color: #fff;padding: 30px;border-radius: 12px;width: 90%;max-width: 600px;position: relative;/* box-shadow: 0 10px 25px rgba(0, 0, 0, 0.3); */ transform: scale(0.9);opacity: 0;transition: transform 0.3s ease-out, opacity 0.3s ease-out;}
.modal.is-open .modal-content{  transform: scale(1);opacity: 1;}
/* ギャラリーモーダル用の調整 */
.modal-gallery-content{  max-width: 510px;/* ギャラリーのために幅を広げる */ width: 80%;padding: 20px 20px 20px;}
.modal-content h3{  font-size: 1.8rem;margin-bottom: 20px;color: #d9001b;text-align: center;}
.modal-dummy-text{  margin-top: 20px;padding-top: 15px;border-top: 1px dashed #ccc;color: #666;font-size: 0.9rem;text-align: center;}
.modal-close{  position: absolute;top: 10px;left: 15px;font-size: 30px;font-weight: bold;line-height: 34px;color: #FFF;border: none;cursor: pointer;background: #00243F;transition: color 0.3s;width: 50px;height: 50px;border-radius: 35px;}
.modal-close:hover{ }
/* --- モーダルギャラリーのスタイル --- */
.modal-gallery{  position: relative;margin: 20px 0;overflow: hidden;/* スライドを隠す */ /* border-radius: 8px; box-shadow: 0 4px 10px rgba(0,0,0,0.1);*/ background-color: #f5f5f5;}
.slide-container{  display: flex;/* JSでwidthとtransformを制御するため、CSSでは設定しない */ transition: transform 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94);}
.slide{  /* JSで幅を計算して設定する */ flex-shrink: 0;position: relative;width: calc(100% / var(--slide-count));/* JSで--slide-countを設定 */ background: #fff}
.slide img{  display: block;width: 100%;height: auto;object-fit: cover;padding: 20px 20px 40px 20px;box-sizing: border-box}
.slide-caption{  position: absolute;bottom: 0;left: 0;width: 100%;background-color: rgba(0, 0, 0, 0.6);color: #fff;padding: 10px;text-align: center;font-size: 0.9rem;opacity: 1;transition: opacity 0.3s;}
/* 矢印ナビゲーション */
.navigation-arrow{  position: absolute;bottom: -5.5%;transform: translateY(-50%);border: none;color: #fff;padding: 8px;cursor: pointer;z-index: 50;border-radius: 50%;width: 70px;height: 45px;display: flex;align-items: center;justify-content: center;}
.navigation-arrow img{  width: 100%}
.navigation-arrow svg{  fill: #fff;width: 24px;height: 24px;}
.prev-arrow{  left: -0.5%;}
.next-arrow{  right: -0.5%;}
/* ドットページネーション */
.dot-pagination{  position: absolute;bottom: 10px;left: 50%;transform: translateX(-50%);display: flex;gap: 8px;z-index: 50;}
.dot{  width: 10px;height: 10px;background-color: #8DC8E8;border: 1px solid #8DC8E8;border-radius: 50%;cursor: pointer;transition: background-color 0.3s, transform 0.3s;}
.dot.active{  background-color: #00243F;/* テーマカラー */ transform: scale(1.2);border-color: #00243F;}
.aboutus{  margin-top: -22%;background: #00243F;padding-top: 22%;position: relative;}
.aboutus .aboutusLtit{  position: absolute;max-width: 46px;width: 5.3%;top: 0;bottom: 0;left: 20px;margin: auto;}
.aboutus::before{  content: "";width: 100%;height: 47px;background-image: url(../img/namis.png);background-repeat: repeat-x;display: block;position: absolute;top: -46px;}
.aboutus div{  width: 80%;max-width: 1300px;margin: 0 auto;text-align: center}
.aboutus div a{  margin: 3em 0;display: inline-block;text-align: center}
.aboutus div a img{ }
.people{  position: relative;padding: 5em 0}
.peopleflex{  max-width: 1300px;width: 75%;margin: 1em auto;display: flex;flex-wrap: wrap;;gap: 2.5%;align-items: flex-start;}
.peopleflex a{ width: calc((100% - 3 * 2.5%) / 4);margin-bottom: 3%}
.peopleflex a:nth-child(5){ margin-left: calc((100% - 3 * 2.5%) / 8);}
.peopleLtit{ position: absolute;max-width: 46px;width: 7.3%;top: 5.5em;left: 10px}
.envi{  background: #8DC8E8;padding: 5em 0;position: relative}
.enviCont{  max-width: 1260px;width: 75%;margin: 0 auto 2em;display: flex;justify-content: space-between;align-items: center;}
.enviCont img{  width: 26%;margin-right: -2px;z-index: 99}
.enviCont div{  width: 75%;text-align: center;color: #00243F;}
.enviCont div h2{  font-size: 45px;letter-spacing : 2px;border-bottom: 2px solid;padding-bottom: 0.5em;text-align: center;margin-bottom: 0.5em}
.enviCont div p{  font-size : 14px;}
.enviLtit{ position: absolute;max-width: 46px;width: 7.3%;top: 5.5em;left: 10px}
a.reamore{ text-align: center;color: #00243F;display: inline-block;font-size: 1em;border-radius : 35px;padding: 20px;width: 40%;max-width: 300px;border: 2px solid;margin-top: 2em}
a.reamore:hover{  background: rgba(255, 255, 255, 0.5);}
.recruit{ background: #E5554F;padding: 5em 0;position: relative}
.recruit div{  max-width: 1300px;width: 65%;margin: 0 auto 2em;display: flex;justify-content: space-between;align-items: flex-start;}
.recruit div a{  width: 30.76%;display: inline-block}
.recruit div a img{ filter : drop-shadow(5px 5px 5px rgba(35, 24, 21, 0.6));}
.recLtit{ position: absolute;max-width: 46px;width: 7.3%;top: 5.5em;left: 10px}
.objR{  position: absolute;right: 2%;top: -11%;z-index: 99}
.objR2{  position: absolute;right: 2%;top: -11%;z-index: 99}
.objL{  position: absolute;left: 2%;top: -13%;z-index: 99}
.objL2{  position: absolute;left: 2%;bottom: -3%;z-index: 99}
.sitetit{  position: fixed;bottom: 50%;right: 35px;width: 18px;z-index: 1999;filter: drop-shadow(0px 5px 4px rgba(35, 24, 21, 0.4));}
.pcentbtn{ position: fixed;bottom: 20%;;right: 0;width: 80px;z-index: 200;filter: drop-shadow(5px 5px 5px rgba(35, 24, 21, 0.6));}
.sitetit img , .pcentbtn img{ width: 100% !important}
/*下層ページ*/

.aboutCwrap{  text-align: center;position: relative;background: linear-gradient(180deg, rgba(255, 255, 255, 1) 0.4%, rgba(250, 253, 254, 1) 28.05%, rgba(247, 251, 253, 1) 37.71%, rgba(139, 193, 219, 1) 58.94%, rgba(134, 191, 218, 1) 69.69%, rgba(124, 186, 215, 1) 99.97%);overflow: hidden}
.aboutCwrap h2{  font-size: 45px;text-align: center;margin: 2em 0 1em;letter-spacing: 0.1em}
.aboutCwrap h2 + img{  width: 80%;max-width: 980px}
.aboutCwrap p{  text-align: center;font-size: 20px;line-height: 1.8em;position: relative;z-index: 99;line-height: 1.7em;font-weight: bold;z-index: 100}
p.ab1p{ padding: 75px 0 250px;}
.aboutCwrap p span{  display: inline-block;background: #f6e47a}
.aboutCwrap p img{  position: absolute;width: 350px;bottom: 0%;z-index: 109;right: 10%}
.aboutWBg1{ position: absolute;width: 155%;top: -5%;left: -45%;}
.ababimg01{  position: absolute;width: 8.76%;left: 4%;z-index: 99;top: 35%;}
.about02{  margin: 0 auto;width: 75%;max-width: 900px;position: relative;z-index: 99;margin-top: -5%;letter-spacing: 0.1em}
.about02 h3{  text-align: left;font-size: 45px;position: relative;z-index: 99;line-height: 1.4em;margin-bottom: 1em}
.about02 h3 span{  font-size: 22px;background: #E5554F;padding: 2px 10px 4px;color: #fff;border-radius: 1em;}
.aboutCwrap p.about02mMdP{ padding-bottom: 0}
.aboutCwrap p.about02BP{  font-size: 40px;line-height: 2em;padding: 0;margin: 1.5em 0}
.aboutCwrap p.about02BP span{ background: #36749D;line-height: 1.5em;color: #fff;padding: 0 10px}
.about03{ margin: 5% auto 0;width: 75%;max-width: 900px;position: relative;}
.abh3{  text-align: center;font-size: 40px;line-height: 1.5em;padding: 0.5em;border-top: 1px solid #00243F;border-bottom: 1px solid #00243F}
.aboutCwrap p.about03BP{  font-size: 40px;line-height: 2em;padding: 0;margin: 1.5em 0;text-align: center}
.aboutCwrap p.about03BP span{ background: #00243F;line-height: 1.5em;color: #fff;padding: 0 10px}
.abh4{ display: inline-block;font-size: 22px;background: #E5554F;padding: 2px 10px 4px;color: #fff;line-height: 1.5em;margin-bottom: 0.5em;border-radius: 1em;}
.abMmimg{  margin: 2em auto}
.bgdeep{ background : linear-gradient(0deg, rgba(54, 116, 157, 1) 0%, rgba(71, 134, 172, 1) 9.37%, rgba(84, 145, 181, 1) 14.8%, rgba(88, 149, 184, 1) 16.48%, rgba(104, 166, 198, 1) 25.93%, rgba(116, 177, 208, 1) 37.65%, rgba(122, 184, 213, 1) 54.15%, rgba(124, 186, 215, 1) 99.97%);}
.bgdeep2{  background: #36749D;padding-bottom: 5%}
.about04{  margin: 0 auto;width: 75%;max-width: 900px;position: relative;z-index: 99;letter-spacing: 0.1em}
.about04 h3{  text-align: right;font-size: 45px;position: relative;z-index: 99;line-height: 1.4em;margin-bottom: 2em}
.about04 h3 span{  font-size: 22px;background: #E5554F;padding: 2px 10px 4px;color: #fff;}
.about04 p{  text-align: right;padding-right: 20%}
.fcfff{ color: #fff}
.aboutWBg2{ position: absolute;width: 155%;top: 0;right: -45%;}
.aboutCwrap p.about04BP{  font-size: 40px;line-height: 2em;padding: 0;margin: 1.5em 0;text-align: center}
.aboutCwrap p.about04BP span{ background: #f6e47a;line-height: 1.5em;color: #00243F;padding: 0 10px}
.ababimg02{  position: absolute;width: 38.22%;left: -6%;z-index: 99;top: 20%;}
.abNum{  width: 48%;text-align: left;color: #fff;margin-bottom: 2em}
.abNum h5{  font-size: 35px;padding-bottom: 0.5em;margin-bottom: 0.5em;border-bottom: 1px solid}
.abNum h5 span{  font-size: 25px}
.abNum p{  font-size: 18px;line-height: 1.5em;text-align: left;     letter-spacing: 0.01em;}
.an1{  margin-left: 27%}
.an2{  margin-left: 17%}
.an3{  margin-left: 7%}
.abNumWrap{  position: relative}
.abnumImg01{  position: absolute;width: 40%;bottom: 0;right: 0}
.contbgY{  background: #f6e47a;border-radius : 48px;padding: 2em;box-sizing: border-box}
.contbgY p{  padding: 0.1em;box-sizing: border-box}
.ababimg03{ position: absolute;width: 25%;top: -14%;left: -5%}
.abah4_1{  position: absolute;left: -18%;width: 55px;top: 55%;}
.abah4_2{  position: absolute;left: -18%;width: 55px;top: 50%}
.abarrow{ position: relative;z-index: 99;}
#about .aboutus{ margin-top: 0;padding-top: 2%;}
#about .aboutus div{  max-width: 980px}
#about .aboutus::before{  content: none;}
.ab30qCwrap h2{  font-size: 45px;text-align: center;margin: 2em 0 1em;letter-spacing: 0.1em}
.ab30qCwrap p.ab30hp{  font-size: 20px;line-height: 1.8em;position: relative;z-index: 99;line-height: 1.7em;font-weight: bold;z-index: 100;width: 90%;max-width: 980px;margin: 0 auto 3%}
.ab30profbox{  display: flex;justify-content: space-between;width: 90%;max-width: 980px;margin: 0 auto 6%}
.ab30profbox div{  width: 30%;display: flex;flex-direction: column;align-items: flex-start;}
.ab30profbox div div{  width: 100%;margin-top: 2%;}
.ab30profbox div img{  width: 100%}
.ab30profbox div h3{ text-align: center;font-size: 20px;margin: 3% auto}
.ab30profbox div p{  font-size: 14px;padding: 0 3%;font-weight: bold;line-height: 1.3em;}
.histryCwrap{  background: url("../img/about/bg_tube.png") repeat-y;background-size: 100% auto;width: 90%;max-width: 1100px;margin: 0 auto}
.histryCwrap h2{ font-size: 40px;text-align: center;padding: 2em 0 1em;letter-spacing: 0.1em}
.histryCwrap p{ font-size: 20px;position: relative;line-height: 1.7em;font-weight: bold;z-index: 100;width: 85%;max-width: 980px;margin: 0 auto}
.histLineBox{  border-left: 2px solid #00243F;width: 80%;margin: 10% auto 0;max-width: 960px;}
.histLineBox img{  width: 100%;margin-left: -1.35%;margin-bottom: 15%}
.histLineBox img:nth-child(3) ,.histLineBox img:nth-child(4) , .histLineBox img:nth-child(6) ,.histLineBox img:nth-child(10) , .histLineBox img:nth-child(11), .histLineBox img:nth-child(13) , .histLineBox img:nth-child(14){  margin-bottom: 1.5%}
.posiCwrap{ width: 90%;max-width: 1100px;margin: 0 auto}
.posiCwrap h2{ font-size: 45px;text-align: center;padding: 2em 0 1em;letter-spacing: 0.1em;}
.posiCwrap p{ font-size: 20px;position: relative;line-height: 1.7em;font-weight: bold;z-index: 100;width: 85%;max-width: 980px;margin: 0 auto 1.5em}
.posiBimg{  width: 90%;max-width: 800px;margin: 0 auto}
.posiBimg img{  width: 100%}
.peopleCwrap{  background: url("../img/about/bg_tube.png") repeat-y;background-size: 100% auto;width: 90%;max-width: 1100px;margin: 0 auto}
.peopleCwrap h2{ font-size: 40px;text-align: center;padding: 2em 0 1em;letter-spacing: 0.1em}
.peopleCont{  width: 85%;max-width: 980px;margin: 0 auto}
.quotesCwrap h2{ font-size: 40px;text-align: center;padding: 2em 0 1em;letter-spacing: 0.1em}
.quotesCwrap p.qttoptx{ font-size: 19px;position: relative;line-height: 1.7em;font-weight: bold;z-index: 100;width: 85%;max-width: 980px;margin: 0 auto}
.reqCwrap{  width: 85%;max-width: 980px;margin: 0 auto;padding-bottom: 10%}
.reqCwrap h2{ font-size: 40px;text-align: center;padding: 2em 0 1em;letter-spacing: 0.1em;}
.reqContents{  margin-top: 4em}
.reqContents h3{  margin-bottom: 1em;font-size: 26px;}
.reqContents p{  font-size: 20px;line-height: 1.5em;font-weight: bold}
.reqContents p.reqnotice{  font-size: 16px;margin-top: 1em}
.mt-10{  margin-top: 10px}
.pforCwrap h2{ font-size: 40px;text-align: center;padding: 2em 0 1em;letter-spacing: 0.1em}
.pforCwrap p.profttxt{ font-size: 20px;position: relative;line-height: 1.7em;font-weight: bold;z-index: 100;width: 85%;max-width: 980px;margin: 0 auto}
.pforCwrap p.profttxt span{  font-size: 40px;background: #E5554F;color: #fff;display: inline-block;padding: 0.2em 0.5em 0.3em;margin: 0.5em 0px;}
.profC01img{  max-width: 700px;display: block;margin: 5% auto;width: 80%}
.pforCwrap p.proftoCtontp{  font-size: 40px;text-align: center;font-weight: bold;margin: 5% 0}
.prfarrow{  display: block;margin: 0 auto 5%}
.proBox{  background: #256791;color: #fff}
.proBox > div{  display: flex;align-items: flex-start;justify-content: space-between;width: 90%;max-width: 980px;margin: 0 auto;padding: 3% 0;align-items: center}
.proBox > div div{ width: 67%;}
.proBox > div div h3{  font-size: 25px;margin-bottom: 5%}
.proBox > div div p{  font-size: 20px;line-height: 1.8em}
.proBox > div div a{  display: block;text-align: center;width: 100%;padding: 0.7em 0;margin-top: 5%;border: 1px solid;border-radius: 30px;font-size: 14px}
.proBox:nth-child(even){  background: #fff;color: #00243F;}
.proBox:nth-child(even) div{ flex-direction: row-reverse;}
.proBox > div img{  width: 23.5%}
.beneCwrap{}
.beneCwrap h2{ font-size: 40px;text-align: center;padding: 2em 0 1em;letter-spacing: 0.1em}
.beneCwrap p.benettxt{ font-size: 20px;position: relative;line-height: 1.7em;font-weight: bold;z-index: 100;width: 85%;max-width: 980px;margin: 0 auto}
.beneCont{ width: 90%;max-width: 980px;margin: 0 auto;padding: 3% 0;}
.beneCont h3{ font-size: 40px;background: #f6e47a;display: block;margin: 0 auto 7%;width: fit-content}
.beneCont > div{  display: flex;align-items: flex-end;justify-content: space-between;border-bottom: 1px solid #00243F;padding: 7% 1%}
.beneCont > div:last-child{  border-bottom: none}
.bt1pxs{  border-top: 1px solid #00243F;}
.beneCont > div div{  width: 32.3%;text-align: center}
.beneCont > div div h4{  font-size: 20px;margin-bottom: 1em;color: #E5554F}
.beneCont > div p{  width: 60%;font-size: 20px;font-weight: bold;line-height: 1.6}
.beneCont > div.bnCsbox{  display: block}
.beneCont > div.bnCsbox > div:first-child{  display: flex;align-items: flex-end;justify-content: space-between;width: 100%}
.beneCont > div.bnCsbox > div > div{  width: 32.3%;text-align: center}
.beneCont > div.bnCsbox > div h4{  font-size: 20px;margin-bottom: 1em;color: #E5554F}
.beneCont > div.bnCsbox > div p{  width: 60%;font-size: 20px;font-weight: bold;line-height: 1.6;text-align: left}
.beneCont > div.bnCsbox > div.bnCscont{  width: 92%;margin: 5% auto;background : #FCF9E3;padding: 5%;display: flex;box-sizing: border-box;align-items: flex-start;}
.beneCont > div.bnCsbox > div.bnCscont p{  width: 70.8%;background: #fff;border-radius: 20px;padding: 1em;font-size: 18px}
.beneCont > div.bnCsbox > div.bnCscont img.tx30tboxRj{  width: 2.8%;margin-left: -2px;margin-right: 2.5%;margin-top: 6.5%;}
.beneCont > div.bnCsbox > div.bnCscont img{  width: 16.666%}
.beneCont2{  padding: 3% 0;background: #8DC8E8}
.beneCont2 > div{ width: 90%;max-width: 980px;margin: 0 auto;padding: 3% 0;}
.beneCont2 > div h3{ font-size: 40px;background: #fff;display: block;margin: 0 auto 7%;width: fit-content}
.beneCont2 > div > div{  display: flex;justify-content: space-between;align-items: stretch}
.beneCont2 > div > div div{  width: 47%;text-align: center;background: #fff;border-radius: 15px;padding: 4% 8%;box-sizing: border-box}
.beneCont2 > div > div div > img{  width: 33%}
.beneCont2 > div > div div h4{  text-align: center;margin: 5% 0 7%}
.beneCont2 > div > div div h4 img{  width: 88%}
.beneCont2 > div > div div p{  font-size: 20px;text-align: left;line-height: 1.8em;font-weight: bold}
.beneCont3{  padding: 3% 0;}
.beneCont3 > h3{ color: #fff;font-size: 40px;background: #E5554F;display: block;margin: 0 auto 7%;width: fit-content}
.beneCont3 > div{ width: 90%;max-width: 980px;margin: 0 auto;padding: 3% 0;border-top: 1px solid #00243F}
.beneCont3 > div h4{  font-size: 45px;letter-spacing: 0.2em;text-align: center;color: #36749D}
.beneCont3 > div h4 img{  width: 1em;margin-right: 0.3em}
.beneCont3 > div > p{  width: 63%;margin: 3% auto;font-size: 20px;font-weight: bold;line-height: 1.6;text-align: center}
.beneCont3 div.bnCscont{  width: 92%;margin: 5% auto;background : #FCF9E3;padding: 5%;display: flex;box-sizing: border-box;align-items: flex-start;}
.beneCont3 div.bnCscont p{  width: 70.8%;background: #fff;border-radius: 20px;padding: 1em;font-size: 18px;font-weight: bold;line-height: 1.6;}
.beneCont3 div.bnCscont img.tx30tboxRj{  width: 2.8%;margin-left: -2px;margin-right: 2.5%;margin-top: 6.5%;}
.beneCont3 div.bnCscont img{  width: 16.666%}
.depCwrap{ }
.depCwrap h2{  font-size: 40px;text-align: center;padding: 2em 0 1em;letter-spacing: 0.1em;}
.depCwrap p.depttxt{  font-size: 20px;position: relative;line-height: 1.7em;font-weight: bold;z-index: 100;width: 85%;max-width: 980px;margin: 0 auto 4%;}
.depCont{ padding-top: 6%;}
.depCont h3{  font-size: 40px;background: #f6e47a;display: block;margin: 0 auto 2em;width: fit-content;}
.depCont>h4, .depCont>p{  max-width: 980px;margin: 0 auto;}
.depCont>p{  margin-bottom: 3%}
.depCont>h4{  font-size: 45px;margin-bottom: 1em}
.depCont>h4 span, .depCont>p{  font-size: 18px;line-height: 1.5em}
.depCont>h4 span{  margin-left: 1em}
.depContOp{  background: #fcf9e3}
.depOpflex{  display: flex;width: 90%;max-width: 980px;margin: 0 auto;}
.depOpflex div:first-child{  width: 24.235%;border-right: 1px solid #06233D;padding-bottom: 3%}
.depOpflex div:first-child img{  width: 40%}
.depOpflex div:nth-child(2){  width: 76.89%;margin-left: -1.25%}
.depOpflex div:nth-child(2) img{  width: 100%;margin-bottom: 10%}
.depOpflex div:nth-child(2) img.mb-4m{  margin-bottom: -4em}
.depContCn{  background: #8bc1df}
.depCnflex{  display: flex;width: 90%;max-width: 980px;margin: 0 auto;padding: 0 0 3%;}
.depCnflex div:first-child{  width: 76.89%;border-right:}
.depCnflex div:first-child img{  width: 100%;}
.depCnflex div:nth-child(2){  width: 24.235%;margin-left: 0}
.depCnflex div:nth-child(2) img{  width: 100%;}
.depContMn{  background: #36749D;color: #fff}
.depContMnt{  background: #00243F;color: #fff}
.depContAd{  background: #E5554F;color: #fff}
.depPatarrow{ width: 40%!important;height: 100%;border: none!important;background: #8BC1DF;clip-path: polygon( 0 0, /* 左上を0に */ 50% 4vh, /* 上中央の谷を5vhに下げてへこみを表現 */ 100% 0, /* 右上を0に */ 100% calc(100% - 5vh), /* 右下 */ 50% 99.5%, /* 下中央の山 (尖り) */ 0% calc(100% - 5vh) /* 左下 */ );align-items: center;}
.depPatarrow p{ writing-mode: vertical-rl;margin: 0 auto;padding-top: 5em;font-size: 22px;font-weight: bold;font-feature-settings: initial;}
.entryContents{  text-align: center}
.entryContents a{ }
.entryContents a img{  width: 90%;max-width: 980px;margin-bottom: 1em}
/* --- レスポンシブ対応 (958px以下) --- */
@media (max-width: 958px){  .pc{  display: none !important}
.sp{  display: inline-block !important}
.mv{  margin: 0 auto;max-width: 1920px;width: 100%;line-height: 0;padding-top: 45px}
.mv img{  width: 100%;height: auto;margin: 0 auto}
/* #top .mv img{ width: 100%;}
*/ a:hover{  opacity: 1 !important;}
.abmv img{  width: 24%}
/* 縦型項目 (SPでは横書きのボタンに) */ .vertical-headings-section{  width: 80%;margin-top: 30px}
.vertical-headings-title{  font-size: 2rem;margin-bottom: 40px;}
.vertical-headings-wrap{  flex-wrap: wrap;gap: 30px 15px;}
.vertical-heading-item{  /* SPでは横書きのボタンとして使う */ width: 28%;height: auto;box-sizing: border-box;border: none;align-items: flex-start;transform: none;/* アニメーションリセット */ border-color: #ccc;}
.vertical-heading-item:hover{  transform: none;}
.vertical-heading-item img:first-child:hover{  transform: none}
.vertical-heading-item:nth-child(2n){  margin-top: 1.5em}
.tabtx{  position: absolute;top: -5%;}
/* モーダルギャラリー */ .modal-gallery-content{  max-width: 95%;/* SPでの調整 */ padding: 15px;}
.modal-content h3{  font-size: 1.5rem;margin-bottom: 10px;}
.navigation-arrow{  width: 60px;height: 37px;}
.dot{  width: 8px;height: 8px;}
.slide-caption{  font-size: 0.8rem;padding: 8px;}
.aboutus{  margin-top: -31%;background: #00243F;padding-top: 30%;padding-bottom: 12%}
.modal-close{  font-size: 15px;line-height: 15px;width: 30px;height: 30px;}
.slide img{ padding: 20px 00px 40px 00px;}
.aboutus div a{  margin: 1.5em 0}
#about .aboutus div{  width: 90%}
.people , .envi , .recruit{  padding: 2em 0;}
.enviCont{ flex-direction: column}
.enviCont div{  width: 80%}
.enviCont div h2{  font-size: 12px;letter-spacing : 0.5px;border-bottom: 2px solid;padding-bottom: 0.5em;text-align: center;margin-bottom: 0.5em;margin-top: 0.5em}
.enviCont div p{  font-size : 10px;line-height: 1.5em;text-align: left;}
a.reamore{ font-size: 10px;padding: 15px;}
.recruit{  padding: 2em 0;}
.recruit div{  flex-direction: column;text-align: center;padding-left: 2em;margin: 0 auto;width: 90%}
.recruit div a{  width: 90%;margin: 1em auto}
.aboutus div{ text-align: right}
.peopleflex{  gap: 4%;width: 88%;}
.peopleflex a{  width: 46%}
.peopleflex a:first-child{  margin-left: 24%}
.peopleflex a:nth-child(4){ margin-left: 4%}
.peopleflex a:nth-child(5){ margin-left: 0}
.enviLtit , .peopleLtit , .recLtit{  top: 3em}
#about .mv{ padding: 58px 0 25px}
#about .abmv{  padding-top: 75px}
.aboutCwrap h2{ font-size: 18px}
.aboutCwrap p{ font-size: 12px;text-align: left;width: 100%;margin: 0.7em auto 0}
.ttlsp{  text-align: center;width: 90% !important}
p.ab1p{  padding: 40px 0 90px;}
.about02, .about03{  width: 90%;}
.about02 h3{  font-size: 18px;margin-bottom: 1em}
.about02 h3 span{  font-size: 12px;}
.aboutCwrap p img{  width: 180px;bottom: 0%;right: -10%;}
.aboutCwrap{ background : linear-gradient(180deg, rgba(255, 255, 255, 1) 0.4%, rgba(250, 253, 254, 1) 5.28%, rgba(247, 251, 253, 1) 6.98%, rgba(139, 193, 219, 1) 24.86%, rgba(133, 190, 217, 1) 32.72%, rgba(126, 187, 215, 1) 50.52%, rgba(124, 186, 215, 1) 99.97%);}
.aboutCwrap p.about02mMdP{  text-align: center;font-size: 10px;letter-spacing: 0.02em;padding-left: 10%}
.ababimg01{  width: 13.76%;left: 2%;z-index: 99;top: 21%;}
.aboutCwrap p.about02BP{ line-height: 1.8em;font-size: 16px;text-align: center}
.abarrow{ width: 20px;margin-bottom: 1em;position: relative;z-index: 99;}
.abh4{  font-size: 12px;}
.abh3{  font-size: 18px;}
.spMimg1{  width: 80%}
.about03{ padding-bottom: 2.5em;margin-top: 0}
.bgdeep{ background : linear-gradient(0deg, rgba(54, 116, 157, 1) 0%, rgba(71, 134, 172, 1) 9.37%, rgba(84, 145, 181, 1) 14.8%, rgba(88, 149, 184, 1) 16.48%, rgba(104, 166, 198, 1) 25.93%, rgba(116, 177, 208, 1) 37.65%, rgba(122, 184, 213, 1) 54.15%, rgba(124, 186, 215, 1) 99.97%);margin-bottom: -1px;}
.bgdeep2{  background: #36749D;padding-bottom: 5%}
.mt-5{ margin-top: -5%}
.aboutCwrap p.about03BP ,.aboutCwrap p.about04BP{ line-height: 1.8em;font-size: 16px;text-align: center;}
.aboutCwrap p.about03BP span{ display: inline;box-decoration-break: clone;}
.ababimg02{  width: 45.22%;left: -16%;z-index: 99;top: 9%;}
.abh3 span{  font-size: 15px}
.abNum{  width: 65%;text-align: left;color: #fff;margin-bottom: 2em}
.an1{  margin-left: 34%}
.an2{  margin-left: 22%}
.an3{  margin-left: 10%}
.abNum h5{  font-size: 18px;padding-bottom: 0.5em;margin-bottom: 0.5em;border-bottom: 1px solid}
.abNum h5 span{  font-size: 10px}
.abnumImg01{  width: 30%}
.ab30qCwrap h2{  font-size: 18px;text-align: center;margin: 1em 0 1em;letter-spacing: 0.1em}
.ab30qCwrap p.ab30hp{  font-size: 12px;}
.ab30profbox{  flex-direction: column;margin: 0 auto 6%}
.ab30profbox div{  width: 100%;display: flex;flex-direction: row;align-items: flex-start;margin-bottom: 3%}
.ab30profbox div div{  width: 100%;display: flex;flex-direction: column;}
.ab30profbox div img{  width: 25%}
.ab30profbox div h3{ text-align: center;font-size: 14px;margin: 3% 3%}
.ab30profbox div p{  font-size: 12px;padding: 0 3%;margin: 0}
.contbgY{  background: #f6e47a;border-radius: 20px;box-sizing: border-box}
.ababimg03{  width: 28%;top: -7%;left: -3%;}
.abMmimg{  margin: 0.5em auto;}
.histryCwrap{  width: 90%}
.histryCwrap h2{  font-size: 18px}
.histryCwrap p{  font-size: 12px;width: 100%}
.histLineBox{ width: 85%}
.histLineBox{  border-left: 1px solid #00243F;}
.posiCwrap h2,.peopleCwrap h2{ font-size: 18px;}
.posiCwrap p{ font-size: 12px;width: 90%}
.peopleMV{  padding-top: 58px;}
.quotesCwrap h2{ font-size: 18px}
.quotesCwrap p.qttoptx{ font-size: 12px;width: 100%}
.quotesCwrap > div{ width: 100%}
.reqCwrap{  width: 90%;padding-bottom: 10%}
.reqCwrap h2{ font-size: 18px;text-align: center;padding: 1em 0 1em;}
.reqContents{  margin-top: 2em}
.reqContents h3{  margin-bottom: 1em;font-size: 20px;}
.reqContents p{  font-size: 14px;line-height: 1.5em;font-weight: bold}
.reqContents p.reqnotice{  font-size: 10px;margin-top: 1em}
.proBox > div{  display: flex;flex-direction: column-reverse;padding: 10% 0}
.proBox:nth-child(even) > div{  display: flex;flex-direction: column-reverse}
.proBox > div div{ width: 100%;}
.proBox > div img{  width: 100%;margin-bottom: 5%;}
.pforCwrap h2{ font-size: 18px;}
.pforCwrap p.profttxt{ font-size: 14px;}
.pforCwrap p.profttxt span , .pforCwrap p.proftoCtontp{  font-size: 18px;}
.prfarrow{  width: 20px;}
.proBox > div div h3{  font-size: 20px;}
.proBox > div div p{  font-size: 14px;}
.proBox > div div a{  font-size: 12px;line-height: 1.4em;padding: 0.5em 0;}
.beneCwrap h2 , .beneCont h3 , .beneCont2 > div h3 , .beneCont3 > h3{ font-size: 18px}
.beneCwrap p.benettxt{ font-size: 14px}
.beneCont > div, .beneCont > div.bnCsbox > div:first-child ,.beneCont2 > div > div ,.beneCont > div.bnCsbox > div.bnCscont, .beneCont3 div.bnCscont{  flex-direction: column}
.beneCont > div{  padding: 7% 0}
.beneCont > div div , .beneCont > div.bnCsbox > div > div{  width: 100%}
.beneCont > div div > img{  width: 55%;margin-bottom: 1em}
.beneCont > div p , .beneCont > div.bnCsbox > div p ,.beneCont2 > div > div div p{  width: 100%;font-size: 14px;}
.beneCont2 > div > div div{  width: 100%;margin-bottom: 1em}
.beneCont3 > div h4{  font-size: 24px;}
.beneCont3 > div > p{  width: 100%;font-size: 14px;text-align: left}
.beneCont > div.bnCsbox > div.bnCscont p ,.beneCont3 div.bnCscont p{  box-sizing: border-box;width: 100%;padding: 0;background: none;font-size: 14px;position: relative}
.beneCont > div.bnCsbox > div.bnCscont img.tx30tboxRj , .beneCont3 div.bnCscont img.tx30tboxRj{ display: none}
.beneCont > div.bnCsbox > div.bnCscont img , .beneCont3 div.bnCscont img{  width: 20.666%;position: absolute;bottom: -65px;right: 0;}
.beneCont2 > div > div div h4 img{  width: 65%;}
.beneCont > div.bnCsbox > div.bnCscont{  margin-bottom: 13%;padding-bottom: 10%;}
.beneCont3 div.bnCscont{ margin-bottom: 20%;padding-bottom: 10%;}
.depCwrap h2{ font-size: 18px}
.depCwrap p.depttxt{  font-size: 14px;}
.depCont h3{ font-size: 18px}
.depCont p{  width: 90%;margin: 0 auto 3%;font-size: 14px;font-weight: bold}
.depCont>h4{  font-size: 20px;width: 90%;margin: 0 auto}
.depCont>h4 span{ font-size: 14px;}
.depOpflex div:first-child{  width: 12.353%;border-right: 1px solid #06233D}
.depOpflex div:first-child img{  width: 71.4%}
.depOpflex div:nth-child(2){  width: 88.23%;margin-left: -1.2%}
.depOpflex div:nth-child(2) div{  width: 100%;margin-left: 0}
.depOpflex div:nth-child(2) img{  width: 100%;margin-bottom: 0}
.depCnflex div:first-child{  width: 76.4%;}
.depCnflex div:first-child img{  width: 100%;margin-bottom: 0}
.depCnflex div:nth-child(2){  width: 24%;margin-left: 0}
.depCnflex div:nth-child(2) img{  width: 100%;margin-bottom: 0}
.depPatarrow{  width: 71.4% !important;clip-path: polygon(0 0, /* 左上を0に */ 50% 1.5vh, /* 上中央の谷を5vhに下げてへこみを表現 */ 100% 0, /* 右上を0に */ 100% calc(100% - 1.5vh), /* 右下 */ 50% 100%, /* 下中央の山 (尖り) */ 0% calc(100% - 1.5vh) /* 左下 */);}
.depPatarrow p{ writing-mode: vertical-rl;margin: 0 auto;padding-top: 2em;font-size: 14px;font-weight: bold;width: fit-content;font-feature-settings: initial;}
.enviCont img{  width: 42%;}
}
/* ========================================
// 汎用アニメーション (下からフェードイン)
// ======================================== */
/* アニメーションの定義 */
@keyframes fadeInUp{  0%{  opacity: 0;transform: translateY(20px);/* 20px下から開始 */}
100%{  opacity: 1;transform: translateY(0);}
}
/* 汎用クラス: アニメーションの基本設定 */
.fade-in-up{  opacity: 0;/* 初期状態では非表示 */ transform: translateY(100px);transition: opacity 0.3s ease-out, transform 0.6s ease-out;/* transition-timing-function: cubic-bezier(0.19, 1, 0.22, 1); /* スムーズなイージング (オプション) */ /* 初期状態ではアニメーションを停止 (JavaScriptで制御) */ animation-name: none;}
/* アニメーションを再生するためのクラス */
/* このクラスをJavaScriptで要素に追加することでアニメーションを開始させます */
.fade-in-up.is-active{  animation-name: fadeInUp;opacity: 1;/* アニメーション中はopacityが1になる */ transform: translateY(0);}
/* 連続する項目に対する時差（ディレイ）の設定 */
/* nth-child()を使って、要素ごとにアニメーション開始時間を遅らせます */
.vertical-headings-wrap .fade-in-up:nth-child(2){  animation-delay: 0.1s;}
.vertical-headings-wrap .fade-in-up:nth-child(3){  animation-delay: 0.2s;}
.vertical-headings-wrap .fade-in-up:nth-child(4){  animation-delay: 0.3s;}
.vertical-headings-wrap .fade-in-up:nth-child(5){  animation-delay: 0.4s;}
.vertical-headings-wrap .fade-in-up:nth-child(6), .vertical-headings-wrap .fade-in-up:nth-child(6){  animation-delay: 0.5s;}